如何防止 JS 中的 babel 转换运算符“typeof”

Den*_*ing 3 babeljs

我用 ES6 语法开发了一个 JS SDK。SDK 的文件大小约为 8Kb。用 babel 编译后,SDK 大小约为 20Kb。我发现 babeltypeof使用帮助程序“ babel-runtime/helpers/typeof ”转换运算符,这增加了我的 SDK 的大小。如果我不在typeof我的 SDK 中使用,我的 SDK 的文件大小约为 7Kb。

_validateCallback(fnName, arg) {
    if (typeof arg !== 'function') {
        throw new TypeError(`[${fnName}]'s arguments[0] must be a function, but get a ${typeof arg}`);
    }
}
Run Code Online (Sandbox Code Playgroud)

我的.babelrc的详细信息:

{
    "presets": [
        [
            "env",
            {
                "targets": {
                    "browsers": [
                        "last 2 versions",
                        "ie >= 9"
                    ]
                }
            }
        ],
        "stage-2"
    ],
    "plugins": [
        "transform-runtime"
    ]
}
Run Code Online (Sandbox Code Playgroud)

devDependencies的package.json

{
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-2": "^6.24.1",
    "webpack": "^4.37.0",
    "webpack-cli": "^3.3.6"
 }
Run Code Online (Sandbox Code Playgroud)

我的webpack.config.js的细节

{
    mode: 'production',
    entry: './main.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'botapp-sdk.' + PACKAGE.version + '.js',
        library: 'BotApp', 
        libraryTarget: 'var', 
    },
    plugins: [

        new webpack.HashedModuleIdsPlugin(),
        new webpack.optimize.ModuleConcatenationPlugin(),
        new webpack.BannerPlugin(PACKAGE.name + ' - ' + PACKAGE.version),
    ],
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: 'babel-loader'
            }
        ]
    }
}
Run Code Online (Sandbox Code Playgroud)

我需要阻止 babel 转换 'typeof',这样我就可以减少我的 SDK 的文件大小。

有什么办法可以防止 babel 变换算子typeof

Den*_*ing 7

我一直在寻找解决问题的方法:

@@ -8,7 +8,10 @@
                         "last 2 versions",
                         "ie >= 9"
                     ]
-                }
+                },
+                "exclude": [
+                    "transform-es2015-typeof-symbol"
+                ]
             }
         ],
         "stage-2"

Run Code Online (Sandbox Code Playgroud)

的细节exclude见:https://babeljs.io/docs/en/babel-preset-env#exclude

  • 在最新版本的`@babel/preset-env`中,插件名称应该是`@babel/plugin-transform-typeof-symbol`。 (2认同)