As a Builder, I want package tree-shaking, so I can minimize my build size, compile time, test time, and page load time.

[MantisClone]

Problem

• The top-level tsconfig.json specifies "module": "commonjs". This prevents tree-shaking, or the elimination of dead code.

According to the webpack docs:

In order to take advantage of tree shaking, you must...

• Use ES2015 module syntax (i.e. import and export).
• Ensure no compilers transform your ES2015 module syntax into CommonJS modules (this is the default behavior of the popular Babel preset @babel/preset-env - see the documentation for more details).
• Add a "sideEffects" property to your project's package.json file.
• Use the production mode configuration option to enable various optimizations including minification and tree shaking.
• Make sure you set a correct value for devtool as some of them can't be used in production mode.

Solution

• Set "module": "node16" and "moduleResolution": "node16" in the tsconfig.json

  For compatibility with Node.js so users who require CommonJS can get it, but consumers of our bundled packages will get ES2020 and can do tree-shaking.

  "module": "node16"

  Available from 4.7+, the node16 and nodenext modes integrate with Node’s native ECMAScript Module support. The emitted JavaScript uses either CommonJS or ES2020 output depending on the file extension and the value of the type setting in the nearest package.json

  "moduleResolution": "node16"

  Node.js v12 and later supports both ECMAScript imports and CommonJS require, which resolve using different algorithms. These moduleResolution values, when combined with the corresponding module values, picks the right algorithm for each resolution based on whether Node.js will see an import or require in the output JavaScript code.

• Append .js to all relative imports filenames

• Set "type": "module" in all package.json files

Definiton of Done

• Make all (or most) of the packages output ES Module output
• Remove Webpack #1203

Non Issues

• Currently, the Request Network packages take advantage of the monorepo to directly import source files instead of respecting the package separation. This means that build tools and bundlers cannot perform "tree-shaking" which removes unnecessary dependencies from the final distribution. This is not true. See Eliminate relative imports between packages and enforce monorepo/no-relative-import eslint rule #1194

---

Migrated from Asana: https://app.asana.com/0/1203912381456855/1205320821557402

[MantisClone]

@skiv71 discovered that when we configure "module": "es2015" we can still use our packages in a node js application with require(). So maybe we don't need to use "module": "node16".

[MantisClone]

We've discussed this task a lot this past week, despite it not being part of the sprint. I've decided to move it into this sprint so that we can implement it and move on.

[MantisClone]

While working on this, I disabled Webpack. I think that we'll remove Webpack as part of this task so I've added #1203 as a subtask in the description.

[MantisClone]

The effort required to fix this is larger than anticipated and upon closer inspection, we realize that tree-shaking will still be blocked by #1202 even after switching to ES Modules.

Thus, we still want to do this task, but I'm reducing the priority to Medium.