如何删除 babel 添加的全局 "use strict"
How to remove global "use strict" added by babel
我正在使用 "use strict" 的函数形式并且不想要 Babel 在转译后添加的全局形式。问题是我正在使用一些不使用 "use strict" 模式的库,它可能会在脚本连接后抛出错误
通天塔 5
你会列入黑名单 "useStrict"
。例如,这是 Gruntfile 中的示例:
babel: {
options: {
blacklist: ["useStrict"],
// ...
},
// ...
}
通天塔 6
因为 Babel 6 是 fully opt-in for plugins now, instead of blacklisting useStrict
, you just don't include the strict-mode
plugin。如果您使用的是包含它的预设,我认为您必须创建自己的包含所有其他预设的预设,但不是那个预设。
就我个人而言,我使用 gulp-iife 插件并将 IIFE 封装在我的所有文件中。我注意到 babel 插件(使用预设 es2015)也添加了全局 "use strict"。我 运行 我的 post babel 代码再次通过 iife 流插件所以它使 babel 所做的无效。
gulp.task("build-js-source-dev", function () {
return gulp.src(jsSourceGlob)
.pipe(iife())
.pipe(plumber())
.pipe(babel({ presets: ["es2015"] }))// compile ES6 to ES5
.pipe(plumber.stop())
.pipe(iife()) // because babel preset "es2015" adds a global "use strict"; which we dont want
.pipe(concat(jsDistFile)) // concat to single file
.pipe(gulp.dest("public_dist"))
});
Babel 6 + es2015
我们可以禁用 babel-plugin-transform-es2015-modules-commonjs
来要求 babel-plugin-transform-strict-mode
。
所以在第151行node_modules/babel-plugin-transform-es2015-modules-commonjs/lib/index.js
注释下面的代码
//inherits: require("babel-plugin-transform-strict-mode"),
只需更改.babelrc
解决方案
如果你不想更改任何 npm 模块,你可以使用 .babelrc
像这样忽略
{
"presets": ["es2015"],
"ignore": [
"./src/js/directive/datePicker.js"
]
}
忽略那个文件,它对我有用!
不能使用'use strict'
的忽略文件是旧代码,不需要用babel改造!
这 grammatically 不正确,但基本上适用于 Babel 5 和 6,无需安装移除另一个模块的模块。
code.replace(/^"use strict";$/, '')
我也遇到了这个相当荒谬的限制,即您无法禁用或覆盖现有预设的设置,因此转而使用此预设:https://www.npmjs.com/package/babel-preset-es2015-without-strict
正如已经提到的 Babel 6,它是添加严格模式的 transform-es2015-modules-commonjs
预设。
如果您想在不进行模块转换的情况下使用整个 es2015
预设,请将其放入您的 .babelrc
文件中:
{
"presets": [
["es2015", { "modules": false }]
]
}
这将禁用模块和严格模式,同时保持启用所有其他 es2015 转换。
从 babel 6 开始,你可以先安装 babel-cli(如果你想从 CLI 使用 Babel)或 babel-core(使用 Node API)。此包不包含模块。
npm install --global babel-cli
# or
npm install --save-dev babel-core
然后安装你需要的模块。所以在你的情况下不要为 'strict mode' 安装模块。
npm install --save-dev babel-plugin-transform-es2015-arrow-functions
并像这样在 .babelrc 文件中添加已安装的模块:
{
"plugins": ["transform-es2015-arrow-functions"]
}
在此处查看详细信息:https://babeljs.io/blog/2015/10/31/setting-up-babel-6
对于 babel 6 而不是猴子修补预设 and/or 分叉并发布它,您也可以只包装原始插件并将 strict
选项设置为 false
。
按照这些思路应该可以解决问题:
const es2015preset = require('babel-preset-es2015');
const commonjsPlugin = require('babel-plugin-transform-es2015-modules-commonjs');
es2015preset.plugins.forEach(function(plugin) {
if (plugin.length && plugin[0] === commonjsPlugin) {
plugin[1].strict = false;
}
});
module.exports = es2015preset;
请使用 "es2015-without-strict" 而不是 "es2015"。不要忘记您需要安装软件包 "babel-preset-es2015-without-strict"。我知道这不是 Babel 的默认行为,请考虑到该项目尚未成熟。
现在有一个 babel 插件,您可以将其添加到您的配置中以移除严格模式:babel-plugin-transform-remove-strict-mode
。添加然后删除 "use strict"
有点难看,但它使配置更好。
文档在 GitHub 存储库中:
https://github.com/genify/babel-plugin-transform-remove-strict-mode
你的 .babelrc 最终看起来像这样:
{
"presets": ["env"],
"plugins": ["transform-remove-strict-mode"]
}
我刚刚制作了一个在节点中运行的脚本并删除了 "use strict";在所选文件中。
文件:script.js:
let fs = require('fs');
let file = 'custom/path/index.js';
let data = fs.readFileSync(file, 'utf8');
let regex = new RegExp('"use\s+strict";');
if (data.match(regex)){
let data2 = data.replace(regex, '');
fs.writeFileSync(file, data2);
console.log('use strict mode removed ...');
}
else {
console.log('use strict mode is missing .');
}
node ./script.js
plugins: [
[
require("@babel/plugin-transform-modules-commonjs"),
{
strictMode: false
}
],
]
如果您正在使用 https://babeljs.io/repl(撰写本文时 v7.8.6
),您可以通过选择 Source Type -> Module[=16= 来删除 "use strict";
].
你可以告诉 babel 你的代码是一个脚本:
sourceType: "script"
这不会添加use strict
。参见 sourceType option docs
来源:https://github.com/babel/babel/issues/7910#issuecomment-388517631
@rcode 的回答中建议的使用插件或禁用模块和严格模式对我不起作用。
但是,按照@andrefarzart 在this GitHub answer 中的建议,将es2015
|es6
文件中的目标从es2015
|es6
更改为es5
解决了这个问题。
// tsconfig.json file
{
// ...
"compilerOptions": {
// ...
"target": "es5", // instead of "es2015"
}
我正在使用 "use strict" 的函数形式并且不想要 Babel 在转译后添加的全局形式。问题是我正在使用一些不使用 "use strict" 模式的库,它可能会在脚本连接后抛出错误
通天塔 5
你会列入黑名单 "useStrict"
。例如,这是 Gruntfile 中的示例:
babel: {
options: {
blacklist: ["useStrict"],
// ...
},
// ...
}
通天塔 6
因为 Babel 6 是 fully opt-in for plugins now, instead of blacklisting useStrict
, you just don't include the strict-mode
plugin。如果您使用的是包含它的预设,我认为您必须创建自己的包含所有其他预设的预设,但不是那个预设。
就我个人而言,我使用 gulp-iife 插件并将 IIFE 封装在我的所有文件中。我注意到 babel 插件(使用预设 es2015)也添加了全局 "use strict"。我 运行 我的 post babel 代码再次通过 iife 流插件所以它使 babel 所做的无效。
gulp.task("build-js-source-dev", function () {
return gulp.src(jsSourceGlob)
.pipe(iife())
.pipe(plumber())
.pipe(babel({ presets: ["es2015"] }))// compile ES6 to ES5
.pipe(plumber.stop())
.pipe(iife()) // because babel preset "es2015" adds a global "use strict"; which we dont want
.pipe(concat(jsDistFile)) // concat to single file
.pipe(gulp.dest("public_dist"))
});
Babel 6 + es2015
我们可以禁用 babel-plugin-transform-es2015-modules-commonjs
来要求 babel-plugin-transform-strict-mode
。
所以在第151行node_modules/babel-plugin-transform-es2015-modules-commonjs/lib/index.js
注释下面的代码
//inherits: require("babel-plugin-transform-strict-mode"),
只需更改.babelrc
解决方案
如果你不想更改任何 npm 模块,你可以使用 .babelrc
像这样忽略
{
"presets": ["es2015"],
"ignore": [
"./src/js/directive/datePicker.js"
]
}
忽略那个文件,它对我有用!
不能使用'use strict'
的忽略文件是旧代码,不需要用babel改造!
这 grammatically 不正确,但基本上适用于 Babel 5 和 6,无需安装移除另一个模块的模块。
code.replace(/^"use strict";$/, '')
我也遇到了这个相当荒谬的限制,即您无法禁用或覆盖现有预设的设置,因此转而使用此预设:https://www.npmjs.com/package/babel-preset-es2015-without-strict
正如已经提到的 Babel 6,它是添加严格模式的 transform-es2015-modules-commonjs
预设。
如果您想在不进行模块转换的情况下使用整个 es2015
预设,请将其放入您的 .babelrc
文件中:
{
"presets": [
["es2015", { "modules": false }]
]
}
这将禁用模块和严格模式,同时保持启用所有其他 es2015 转换。
从 babel 6 开始,你可以先安装 babel-cli(如果你想从 CLI 使用 Babel)或 babel-core(使用 Node API)。此包不包含模块。
npm install --global babel-cli
# or
npm install --save-dev babel-core
然后安装你需要的模块。所以在你的情况下不要为 'strict mode' 安装模块。
npm install --save-dev babel-plugin-transform-es2015-arrow-functions
并像这样在 .babelrc 文件中添加已安装的模块:
{
"plugins": ["transform-es2015-arrow-functions"]
}
在此处查看详细信息:https://babeljs.io/blog/2015/10/31/setting-up-babel-6
对于 babel 6 而不是猴子修补预设 and/or 分叉并发布它,您也可以只包装原始插件并将 strict
选项设置为 false
。
按照这些思路应该可以解决问题:
const es2015preset = require('babel-preset-es2015');
const commonjsPlugin = require('babel-plugin-transform-es2015-modules-commonjs');
es2015preset.plugins.forEach(function(plugin) {
if (plugin.length && plugin[0] === commonjsPlugin) {
plugin[1].strict = false;
}
});
module.exports = es2015preset;
请使用 "es2015-without-strict" 而不是 "es2015"。不要忘记您需要安装软件包 "babel-preset-es2015-without-strict"。我知道这不是 Babel 的默认行为,请考虑到该项目尚未成熟。
现在有一个 babel 插件,您可以将其添加到您的配置中以移除严格模式:babel-plugin-transform-remove-strict-mode
。添加然后删除 "use strict"
有点难看,但它使配置更好。
文档在 GitHub 存储库中: https://github.com/genify/babel-plugin-transform-remove-strict-mode
你的 .babelrc 最终看起来像这样:
{
"presets": ["env"],
"plugins": ["transform-remove-strict-mode"]
}
我刚刚制作了一个在节点中运行的脚本并删除了 "use strict";在所选文件中。
文件:script.js:
let fs = require('fs');
let file = 'custom/path/index.js';
let data = fs.readFileSync(file, 'utf8');
let regex = new RegExp('"use\s+strict";');
if (data.match(regex)){
let data2 = data.replace(regex, '');
fs.writeFileSync(file, data2);
console.log('use strict mode removed ...');
}
else {
console.log('use strict mode is missing .');
}
node ./script.js
plugins: [
[
require("@babel/plugin-transform-modules-commonjs"),
{
strictMode: false
}
],
]
如果您正在使用 https://babeljs.io/repl(撰写本文时 v7.8.6
),您可以通过选择 Source Type -> Module[=16= 来删除 "use strict";
].
你可以告诉 babel 你的代码是一个脚本:
sourceType: "script"
这不会添加use strict
。参见 sourceType option docs
来源:https://github.com/babel/babel/issues/7910#issuecomment-388517631
@rcode 的回答中建议的使用插件或禁用模块和严格模式对我不起作用。
但是,按照@andrefarzart 在this GitHub answer 中的建议,将es2015
|es6
文件中的目标从es2015
|es6
更改为es5
解决了这个问题。
// tsconfig.json file
{
// ...
"compilerOptions": {
// ...
"target": "es5", // instead of "es2015"
}