feat: add dual packaging

.eslintrc

@@ -210,7 +210,7 @@
       }
     },
     {
-      "files": ["*.js"],
+      "files": ["*.{js,cjs}"],
       "rules": {
         "strict": 0
       }

package.json

@@ -3,7 +3,7 @@
   "scripts": {
     "bootstrap": "lerna bootstrap --no-ci",
     "build": "lerna run build --concurrency=1",
-    "lint": "eslint --ext .js,.ts,.tsx .",
+    "lint": "eslint --ext .js,.cjs,.ts,.tsx .",
     "postinstall": "npm run bootstrap",
     "publish:next": "lerna publish --canary --preid dev --npm-tag next --no-git-tag-version",
     "unit:coverage": "npm run unit -- --coverage",

packages/classname/index.cjs

@@ -0,0 +1,7 @@
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./build/classname.production.min.cjs')
+} else {
+  module.exports = require('./build/classname.development.cjs')
+}

packages/classname/package.json

@@ -5,8 +5,20 @@
   "homepage": "https://github.com/bem/bem-react/tree/master/packages/classname",
   "repository": "https://github.com/bem/bem-react",
   "keywords": ["bem", "naming", "classes", "notation", "core"],
-  "main": "index.js",
+  "main": "index.cjs",
   "typings": "classname.d.ts",
+  "exports": {
+    "development": {
+      "require": "./build/classname.development.cjs",
+      "module": "./build/classname.development.mjs"
+    },
+    "production": {
+      "require": "./build/classname.production.min.cjs",
+      "module": "./build/classname.production.min.mjs"
+    },
+    "require": "./index.cjs",
+    "default": "./build/classname.production.min.mjs"
+  },
   "publishConfig": {
     "access": "public"
   },

packages/classnames/index.cjs

@@ -0,0 +1,7 @@
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./build/classnames.production.min.cjs')
+} else {
+  module.exports = require('./build/classnames.development.cjs')
+}

packages/classnames/package.json

@@ -5,8 +5,20 @@
   "homepage": "https://github.com/bem/bem-react/tree/master/packages/classnames",
   "repository": "https://github.com/bem/bem-react",
   "keywords": ["classes", "merge"],
-  "main": "index.js",
+  "main": "index.cjs",
   "typings": "classnames.d.ts",
+  "exports": {
+    "development": {
+      "require": "./build/classnames.development.cjs",
+      "module": "./build/classnames.development.mjs"
+    },
+    "production": {
+      "require": "./build/classnames.production.min.cjs",
+      "module": "./build/classnames.production.min.mjs"
+    },
+    "require": "./index.cjs",
+    "default": "./build/classnames.production.min.mjs"
+  },
   "publishConfig": {
     "access": "public"
   },

packages/core/index.cjs

@@ -0,0 +1,7 @@
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./build/core.production.min.cjs')
+} else {
+  module.exports = require('./build/core.development.cjs')
+}

packages/core/package.json

@@ -5,8 +5,20 @@
   "homepage": "https://github.com/bem/bem-react/tree/master/packages/core",
   "repository": "https://github.com/bem/bem-react",
   "keywords": ["bem", "modifier", "withBemMod", "core"],
-  "main": "index.js",
+  "main": "index.cjs",
   "typings": "core.d.ts",
+  "exports": {
+    "development": {
+      "require": "./build/core.development.cjs",
+      "module": "./build/core.development.mjs"
+    },
+    "production": {
+      "require": "./build/core.production.min.cjs",
+      "module": "./build/core.production.min.mjs"
+    },
+    "require": "./index.cjs",
+    "default": "./build/core.production.min.mjs"
+  },
   "publishConfig": {
     "access": "public"
   },

packages/di/package.json

@@ -5,8 +5,20 @@
   "homepage": "https://github.com/bem/bem-react/tree/master/packages/di",
   "repository": "https://github.com/bem/bem-react",
   "keywords": ["bem", "level", "dependency", "di", "dependency injection", "react"],
-  "main": "index.js",
+  "main": "index.cjs",
   "typings": "di.d.ts",
+  "exports": {
+    "development": {
+      "require": "./build/di.development.cjs",
+      "module": "./build/di.development.mjs"
+    },
+    "production": {
+      "require": "./build/di.production.min.cjs",
+      "module": "./build/di.production.min.mjs"
+    },
+    "require": "./index.cjs",
+    "default": "./build/di.production.min.mjs"
+  },
   "publishConfig": {
     "access": "public"
   },

scripts/rollup/build.js

@@ -78,19 +78,31 @@ function getPackageData(packagePath) {
     inputFile,
     outputs: [
       {
-        outputFile: resolve(buildPath, `${packageName}.production.min.js`),
+        outputFile: resolve(buildPath, `${packageName}.production.min.cjs`),
         isProduction: true,
+        isESM: false,
       },
       {
-        outputFile: resolve(buildPath, `${packageName}.development.js`),
+        outputFile: resolve(buildPath, `${packageName}.production.min.mjs`),
+        isProduction: true,
+        isESM: true,
+      },
+      {
+        outputFile: resolve(buildPath, `${packageName}.development.cjs`),
+        isProduction: false,
+        isESM: false,
+      },
+      {
+        outputFile: resolve(buildPath, `${packageName}.development.mjs`),
         isProduction: false,
+        isESM: true,
       },
     ],
   }
 }
 
 function build({ packageName, tsConfigPath, externalDependencies, inputFile, outputs }) {
-  outputs.forEach(async ({ outputFile, isProduction }) => {
+  outputs.forEach(async ({ outputFile, isProduction, isESM }) => {
     const inputConfig = {
       input: inputFile,
       plugins: getPlugins({ isProduction, tsConfigPath }),
@@ -99,7 +111,7 @@ function build({ packageName, tsConfigPath, externalDependencies, inputFile, out
 
     const outputConfig = {
       file: outputFile,
-      format: 'cjs',
+      format: isESM ? 'es' : 'cjs',
       interop: false,
     }