Merge pull request #71 from zillow/fix/dual-package-extensions

fix: dual package extensions

MIGRATE-7-to-8.md

@@ -10,23 +10,25 @@ You will need to modify output file pointers and dependencies.
 
 The new build process uses Rollup and creates 4 bundles, dev and prod for ESM and CJS. An application, which imports your package, will select a correct bundle, based on node environment and bundler capabilities. In example, ESM for Vite or CJS for Webpack 4.
 
+If you use `"type": "module"`, we recommend using `.cjs` extensions for CJS files, and if you do not, then `.mjs` for ESM files.
+
 Modify your `package.json` to use the following:
 
 ```json
 {
     "main": "dist/cjs/prod/index.js",
-    "module": "dist/es/prod/index.js",
+    "module": "dist/es/prod/index.mjs",
     "exports": {
         "development": {
-            "import": "./dist/es/dev/index.js",
+            "import": "./dist/es/dev/index.mjs",
             "require": "./dist/cjs/dev/index.js"
         },
         "production": {
-            "import": "./dist/es/prod/index.js",
+            "import": "./dist/es/prod/index.mjs",
             "require": "./dist/cjs/prod/index.js"
         },
         "default": {
-            "import": "./dist/es/prod/index.js",
+            "import": "./dist/es/prod/index.mjs",
             "require": "./dist/cjs/prod/index.js"
         }
     }

bin/commands/scripts/build.js

@@ -1,14 +1,9 @@
-const { join } = require('path');
 const runParallel = require('run-parallel');
 const runSeries = require('run-series');
 const { spawn } = require('child_process');
 const { rollup } = require('../../util/executables');
 const noop = require('../../util/noop');
-const copyTemplate = require('../../util/copy-template');
-const { DIRECTORIES, MODULE_FORMATS, NODE_ENVIRONMENTS } = require('../../../lib');
-
-const distTemplateDirectory = join(__dirname, `../../../templates/${DIRECTORIES.DIST}`);
-const distTargetDirectory = join(process.cwd(), DIRECTORIES.DIST);
+const { MODULE_FORMATS, NODE_ENVIRONMENTS } = require('../../../lib');
 
 const build = ({ env, format, flags, cb }) =>
     spawn(rollup, ['-c', ...flags], {
@@ -34,11 +29,5 @@ module.exports = ({ callback = noop, flags }) => {
                       build({ env: NODE_ENVIRONMENTS.PROD, format: MODULE_FORMATS.CJS, flags, cb }),
               ]),
     ];
-    runSeries(
-        [
-            cb => copyTemplate(distTemplateDirectory, distTargetDirectory, {}, cb),
-            cb => runParallel(steps, cb),
-        ],
-        callback
-    );
+    runSeries([cb => runParallel(steps, cb)], callback);
 };

lib/configs/rollup.config.js

@@ -5,6 +5,7 @@ const { nodeResolve } = require('@rollup/plugin-node-resolve');
 const { join } = require('path');
 const { terser } = require('rollup-plugin-terser');
 const DIRECTORIES = require('../constants/DIRECTORIES');
+const MODULE_FORMATS = require('../constants/MODULE_FORMATS');
 const NODE_ENVIRONMENTS = require('../constants/NODE_ENVIRONMENTS');
 
 const currentDirectory = process.cwd();
@@ -22,12 +23,26 @@ try {
 const { MODULE_FORMAT, NODE_ENV } = process.env;
 const isProduction = NODE_ENV === NODE_ENVIRONMENTS.PROD;
 const outputDirectory = isProduction ? DIRECTORIES.PROD : DIRECTORIES.DEV;
+const pgkIsModule = pkg.type === 'module';
+
+const getExtension = () => {
+    if (MODULE_FORMAT === MODULE_FORMATS.CJS) {
+        return pgkIsModule ? '.cjs' : '.js';
+    }
+
+    if (MODULE_FORMAT === MODULE_FORMATS.ESM) {
+        return pgkIsModule ? '.js' : '.mjs';
+    }
+
+    return '.js';
+};
 
 module.exports = {
     input: `${currentDirectory}/${DIRECTORIES.SRC}/index.js`,
 
     output: {
         dir: `${currentDirectory}/${DIRECTORIES.DIST}/${MODULE_FORMAT}/${outputDirectory}`,
+        entryFileNames: `[name]${getExtension()}`,
         exports: 'named',
         format: MODULE_FORMAT,
         interop: 'auto',
@@ -37,7 +52,12 @@ module.exports = {
         validate: true,
     },
 
-    external: [...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {})],
+    external: [
+        ...Object.keys(pkg.dependencies || {}),
+        ...Object.keys(pkg.devDependencies || {}),
+        ...Object.keys(pkg.peerDependencies || {}),
+        /^@babel\/.*/,
+    ],
 
     plugins: [
         nodeResolve({