[英]Is there a simple source for setting up babel/webpack for IE11?
I am looking for help transforming es6 to es5 with babel/webpack and am coming up empty. 我正在寻找使用babel / webpack将es6转换为es5的帮助,并且变得空了。 If there is already an answer for this, please tell me. 如果已经有答案,请告诉我。
package.json: 的package.json:
"dependencies": {
"@babel/polyfill": "^7.0.0",
"browserslist": "^4.4.1",
...
"devDependencies": {
"@babel/preset-env": "^7.3.1",
"eslint": "^5.1.0",
...
webpack.config.js: webpack.config.js:
const path = require('path');
const CleanPlugin = require('clean-webpack-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');
module.exports = {
entry: {
App: ['@babel/polyfill', './app.js'],
Library: ['@babel/polyfill', './codegen/library.js'],
CalculatorPage: ['@babel/polyfill', './calculator-page.js'],
CalculatorPageExternal: ['@babel/polyfill', './calculator-page-external.js']
},
output: {
path: path.resolve(__dirname, 'static'),
filename: 'Calc.[name].[chunkhash].js',
library: [ 'Calc', '[name]' ]
}
app.js: app.js:
require("@babel/polyfill");
...
.babelrc: .babelrc:
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"browsers": ["IE >= 10"]
}
}
]
]
}
So far, this changes nothing about what is generated when webpack runs. 到目前为止,这对于webpack运行时生成的内容没有任何改变。
I understand questions around this have been asked before - but it seems every answer is so specific to that person's use case that I am having a hard time finding a single source of "this is how you transform esNext to es5" with babel and webpack." 我知道以前曾问过有关此问题的问题-但似乎每个答案都针对该人的用例,以至于我很难用babel和webpack找到“这就是将esNext转换为es5的方式”的单一来源。 “
What am I missing/what needs to be done to make this actually generate es5 compatible code? 我缺少什么/需要做些什么才能真正生成与es5兼容的代码?
rules.loaders
is the webpack key you're searching for. rules.loaders
是您要搜索的webpack密钥。
Using babel-loader
and @babel/preset-env
(preset for polyfill-ing / transforming all yearly EcmaScript specs without a need for micromanaging specific specs eg ES6) you'll be able to achieve this. 使用babel-loader
和@babel/preset-env
(预设填充/转换所有年度EcmaScript规格,而无需微管理特定规格,例如ES6),您将能够实现这一目标。
You need to configure the preset to browsers you need to target as well. 您还需要为需要定位的浏览器配置预设。
Use the following: 使用以下内容:
[
'@babel/preset-env',
{
targets: {
browsers: ["IE 11"],
},
useBuiltIns: 'usage'
}
]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.