Merge pull request #1430 from alibaba/feat-rm-useless-code

[Feat] add dead code elimination

.eslintignore

@@ -1,5 +1,6 @@
 node_modules
 lib
+es
 dist
 build
 coverage

.gitignore

@@ -5,6 +5,7 @@ npm-debug.log
 lerna-debug.log
 npm-debug.log*
 lib/
+es/
 dist/
 build/
 coverage/

babel.config.js

@@ -6,7 +6,7 @@ module.exports = function(api) {
     'presets': [
       '@babel/preset-flow',
       ['@babel/preset-env', {
-        'loose': true
+        'loose': true,
       }],
       ['@babel/preset-react', {
         'pragma': 'createElement'

jest.config.js

@@ -18,6 +18,7 @@ module.exports = {
     '/__files__/',
     '/lib/',
     '/dist/',
+    '/es/',
     'sfc-loader',
     'atag',
     'rax-cli/src/generator/'

package.json

@@ -17,6 +17,7 @@
     "babel-eslint": "10.0.1",
     "babel-jest": "23.6.0",
     "babel-loader": "8.0.4",
+    "babel-merge": "^3.0.0",
     "babel-plugin-transform-jsx-stylesheet": "0.6.5",
     "chalk": "^2.4.1",
     "chokidar": "^2.0.4",

packages/driver-dom/package.json

@@ -1,9 +1,10 @@
 {
   "name": "driver-dom",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "DOM driver for Rax",
   "license": "BSD-3-Clause",
   "main": "lib/index.js",
+  "module": "es/index.js",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/alibaba/rax.git"

packages/driver-universal/package.json

@@ -1,9 +1,11 @@
 {
   "name": "driver-universal",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Driver for Universal App.",
   "license": "BSD-3-Clause",
   "main": "lib/index.js",
+  "module": "es/index.js",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "git+https://github.com/alibaba/rax.git"

packages/driver-universal/src/weex.js

@@ -1,12 +1,12 @@
 import * as DriverWeex from 'driver-weex';
-import { convertUnit, setRem } from 'style-unit';
+import { convertUnit, setRpx } from 'style-unit';
 
 const driver = Object.assign({}, DriverWeex, {
   beforeRender() {
     // Turn off batched updates
     document.open();
     // Init rem unit
-    setRem( 1 );
+    setRpx( 1 );
   },
   createElement(type, props = {}) {
     const style = {};

packages/driver-weex/package.json

@@ -1,9 +1,10 @@
 {
   "name": "driver-weex",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Weex driver for Rax",
   "license": "BSD-3-Clause",
   "main": "lib/index.js",
+  "module": "es/index.js",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/alibaba/rax.git"
@@ -12,4 +13,4 @@
     "url": "https://github.com/alibaba/rax/issues"
   },
   "homepage": "https://github.com/alibaba/rax#readme"
-}
+}

packages/rax-app/package.json

@@ -1,8 +1,9 @@
 {
   "name": "rax-app",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Rax application framework for univesal app.",
   "main": "lib/index.js",
+  "module": "es/index.js",
   "author": "Rax Team",
   "repository": {
     "type": "git",
@@ -13,7 +14,7 @@
   },
   "homepage": "https://github.com/alibaba/rax#readme",
   "dependencies": {
-    "driver-universal": "^1.0.2",
+    "driver-universal": "^2.0.0",
     "history": "^4.9.0",
     "querystring": "^0.2.0",
     "rax-use-router": "^3.0.0",
@@ -22,4 +23,4 @@
   "peerDependencies": {
     "rax": "^1.0.8"
   }
-}
+}

scripts/compile-packages.js

@@ -13,4 +13,4 @@
 const compile = require('./compile');
 
 compile('packages');
-
+compile('packages', true);

scripts/compile.js

@@ -22,17 +22,13 @@ const parseArgs = require('minimist');
 const chokidar = require('chokidar');
 
 const SRC_DIR = 'src';
-const BUILD_DIR = 'lib';
 const JS_FILES_PATTERN = '**/*.js';
 const IGNORE_PATTERN = '**/{__tests__,__mocks__}/**';
 
 const args = parseArgs(process.argv);
 const customPackages = args.packages;
 
-const babelOptions = require('../babel.config')();
-
-babelOptions.babelrc = false;
-// babelOptions.sourceMaps = 'inline';
+const getBabelConfig = require('./config/getBabelConfig');
 
 const fixedWidth = str => {
   const WIDTH = 80;
@@ -44,7 +40,7 @@ const fixedWidth = str => {
   return strs.slice(0, -1).concat(lastString).join('\n');
 };
 
-function buildPackage(packagesDir, p) {
+function buildPackage(packagesDir, p, isBuildEs) {
   const srcDir = path.resolve(p, SRC_DIR);
   const pattern = path.resolve(srcDir, '**/*');
   const files = glob.sync(pattern, {nodir: true});
@@ -53,7 +49,7 @@ function buildPackage(packagesDir, p) {
     fixedWidth(`${path.basename(p)}\n`)
   );
 
-  files.forEach(file => buildFile(packagesDir, file, true));
+  files.forEach(file => buildFile(packagesDir, file, isBuildEs));
   process.stdout.write(`[  ${chalk.green('OK')}  ]\n`);
 }
 
@@ -71,51 +67,40 @@ function getPackages(packagesDir, customPackages) {
     .filter(f => fs.lstatSync(path.resolve(f)).isDirectory());
 }
 
-function buildFile(packagesDir, file, silent) {
+function buildFile(packagesDir, file, isBuildEs) {
+  const BUILD_DIR = isBuildEs ? 'es' : 'lib';
   const packageName = path.relative(packagesDir, file).split(path.sep)[0];
   const packageSrcPath = path.resolve(packagesDir, packageName, SRC_DIR);
   const packageBuildPath = path.resolve(packagesDir, packageName, BUILD_DIR);
   const relativeToSrcPath = path.relative(packageSrcPath, file);
   const destPath = path.resolve(packageBuildPath, relativeToSrcPath);
 
-  spawnSync('mkdir', ['-p', path.dirname(destPath)]);
-  if (minimatch(file, IGNORE_PATTERN)) {
-    silent || process.stdout.write(
-      chalk.dim('  \u2022 ') +
-      path.relative(packagesDir, file) +
-      ' (ignore)\n'
-    );
-  } else if (!minimatch(file, JS_FILES_PATTERN)) {
-    fs.createReadStream(file).pipe(fs.createWriteStream(destPath));
-    silent || process.stdout.write(
-      chalk.red('  \u2022 ') +
-      path.relative(packagesDir, file) +
-      chalk.red(' \u21D2 ') +
-      path.relative(packagesDir, destPath) +
-      ' (copy)' +
-      '\n'
-    );
+  let babelOptions;
+  if (isBuildEs) {
+    babelOptions = getBabelConfig(true);
   } else {
-    const transformed = babel.transformFileSync(file, babelOptions).code;
-    spawnSync('mkdir', ['-p', path.dirname(destPath)]);
-    fs.writeFileSync(destPath, transformed);
-    silent || process.stdout.write(
-      chalk.green('  \u2022 ') +
-      path.relative(packagesDir, file) +
-      chalk.green(' \u21D2 ') +
-      path.relative(packagesDir, destPath) +
-      '\n'
-    );
+    babelOptions = getBabelConfig();
+  }
+
+  spawnSync('mkdir', ['-p', path.dirname(destPath)]);
+  if (!minimatch(file, IGNORE_PATTERN)) {
+    if (!minimatch(file, JS_FILES_PATTERN)) {
+      fs.createReadStream(file).pipe(fs.createWriteStream(destPath));
+    } else {
+      const transformed = babel.transformFileSync(file, babelOptions).code;
+      spawnSync('mkdir', ['-p', path.dirname(destPath)]);
+      fs.writeFileSync(destPath, transformed);
+    }
   }
 }
 
 // const packagesDir = path.resolve(__dirname, '../packages');
-module.exports = function compile(packagesName) {
+module.exports = function compile(packagesName, isBuildEs) {
   const packagesDir = path.resolve(__dirname, `../${packagesName}`);
+  const packages = getPackages(packagesDir, customPackages);
 
   if (args.watch) {
     // watch packages
-    const packages = getPackages(packagesDir, customPackages);
     const watchPackagesDir = packages.map(dir => path.resolve(dir, SRC_DIR));
 
     console.log(chalk.green('watch packages compile', packages));
@@ -127,13 +112,15 @@ module.exports = function compile(packagesName) {
       const packagePath = path.resolve(__dirname, `../${packagesName}/`, packageName);
       process.stdout.write(chalk.bold.inverse(`Compiling package ${packageName} \n`));
       try {
-        buildPackage(packagesDir, packagePath);
+        buildPackage(packagesDir, packagePath, isBuildEs);
       } catch (e) {}
       process.stdout.write('\n');
     });
   } else {
     process.stdout.write(chalk.bold.inverse('Compiling packages\n'));
-    getPackages(packagesDir, customPackages).forEach(buildPackage.bind(null, packagesDir));
+    packages.forEach((v) => {
+      buildPackage(packagesDir, v, isBuildEs);
+    });
     process.stdout.write('\n');
   }
 };

scripts/config/getBabelConfig.js

@@ -0,0 +1,19 @@
+const babelMerge = require('babel-merge');
+
+const babelConfig = require('../../babel.config')();
+
+module.exports = function(ignoreModule) {
+  const envOpt = {
+    loose: true,
+  };
+
+  if (ignoreModule) {
+    envOpt.modules = false;
+  }
+
+  return babelMerge(babelConfig, {
+    presets: [
+      ['@babel/preset-env', envOpt],
+    ],
+  });
+};

scripts/dist-builtins.js

@@ -10,7 +10,7 @@ const fs = require('fs');
 // build packages
 const PACKAGES_NAME = 'packages';
 const PACKAGES_DIR = path.resolve(__dirname, `../${PACKAGES_NAME}`);
-const babelOptions = require('../babel.config')();
+const babelOptions = require('./config/getBabelConfig')();
 
 let packageList = fs.readdirSync(PACKAGES_DIR);
 let buildinObj = {};
@@ -175,4 +175,4 @@ function dist(config) {
       resolver();
     });
   });
-}
+}

scripts/dist-core.js

@@ -8,6 +8,9 @@ const babel = require('rollup-plugin-babel');
 const { uglify } = require('rollup-plugin-uglify');
 const replace = require('rollup-plugin-replace');
 const gzipSize = require('gzip-size');
+const babelMerge = require('babel-merge');
+
+const babelOptions = require('./config/getBabelConfig')();
 
 const IIFE = 'iife';
 const UMD = 'umd';
@@ -76,7 +79,7 @@ async function build({ package: packageName, entry = 'src/index.js', name, shoul
         // use /pakacges/ would get error and it seemed to be a rollup-plugin-commonjs bug
         include: /(node_modules|style-unit)/,
       }),
-      babel({
+      babel(babelMerge(babelOptions, {
         exclude: 'node_modules/**', // only transpile our source code
         presets: [
           ['@babel/preset-env', {
@@ -87,7 +90,7 @@ async function build({ package: packageName, entry = 'src/index.js', name, shoul
             }
           }]
         ],
-      }),
+      })),
       replace({
         'process.env.NODE_ENV': JSON.stringify(shouldMinify ? 'production' : 'development'),
       }),
@@ -118,20 +121,16 @@ async function build({ package: packageName, entry = 'src/index.js', name, shoul
   }
 }
 
-build({ package: 'rax', name: 'Rax' });
-build({ package: 'rax', name: 'Rax', format: IIFE });
-build({ package: 'rax', name: 'Rax', format: IIFE, shouldMinify: true });
-build({ package: 'rax', name: 'Rax', format: ESM });
-
-build({ package: 'driver-dom', name: 'DriverDOM' });
-build({ package: 'driver-dom', name: 'DriverDOM', format: IIFE });
-build({ package: 'driver-dom', name: 'DriverDOM', format: IIFE, shouldMinify: true });
-build({ package: 'driver-dom', name: 'DriverDOM', format: ESM });
+function buildCorePackages(packageName, name) {
+  build({ package: packageName, name: name });
+  build({ package: packageName, name: name, format: IIFE });
+  build({ package: packageName, name: name, format: IIFE, shouldMinify: true });
+  build({ package: packageName, name: name, format: ESM });
+}
 
-build({ package: 'driver-weex', name: 'DriverWeex' });
-build({ package: 'driver-weex', name: 'DriverWeex', format: IIFE });
-build({ package: 'driver-weex', name: 'DriverWeex', format: IIFE, shouldMinify: true });
-build({ package: 'driver-weex', name: 'DriverWeex', format: ESM });
+buildCorePackages('rax', 'Rax');
+buildCorePackages('driver-dom', 'DriverDOM');
+buildCorePackages('driver-weex', 'DriverWeex');
 
 build({ package: 'driver-worker', name: 'DriverWorker' });
 build({ package: 'driver-worker', name: 'DriverWorker', format: IIFE, shouldExportDefault: true });

scripts/dist-packages.js

@@ -4,7 +4,7 @@ const path = require('path');
 const webpack = require('webpack');
 const RaxPlugin = require('rax-webpack-plugin');
 const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
-const babelOptions = require('../babel.config')();
+const babelOptions = require('./config/getBabelConfig')();
 
 dist(getConfig(
   {

scripts/dist-universal.js

@@ -8,7 +8,7 @@ const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
 const fs = require('fs');
 
 const PACKAGES_DIR = path.resolve(__dirname, '../universal');
-const babelOptions = require('../babel.config')();
+const babelOptions = require('./config/getBabelConfig')();
 
 function normalizeGlobalName(name) {
   return uppercamelcase(name);