如何解决babel-loader 未在转译文件中进行插值
我正在学习 webpack,并且有一个简单的 javascript,它使用了一些 ES6。
function sayHello(){
let tool = 'webpack';
alert('Hello I am ${tool},welcome to ES6');
}
/*module.exports = sayHello;*/
// use ES6 modules
export { sayHello };
我已经像这样配置了 babel-loader
module: {
rules: [
{
test: /\.m?js$/,exclude: /(node_modules|bower_components)/,use: {
loader: 'babel-loader',options: {
presets: ['@babel/preset-env']
}
}
}
]
}
如果我检查转译后的文件,我会发现它将 let 转换为 var,但我期望它会将“${tool}”插入到诸如“.concat(tool,...”之类的内容)。
我错过了什么?
解决方法
@babel/preset-env
将仅对特定目标使用转换。这意味着如果目标环境相当新,则只应用几个转换;如果目标环境较旧,则应用大量转换。
您可以使用以下方法检查默认值:
npx browserlist
哪个应该为您提供 @babel/preset-env
定位的浏览器列表。
话虽如此。你在那里拥有的东西不需要转换。您可能正在考虑模板文字:
alert(`Hello I am ${tool},welcome to ES6`);
注意字符 `
与 '
不同。
在撰写本文时,我认为应该在默认安装上进行转换。由于 IE11 不支持模板文字,因此它在浏览器列表中。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。