在 webpack 中使用 babel-polyfill
Using babel-polyfill with webpack
我在尝试将 babel-polyfill 与 webpack 一起使用时,不断遇到以下 错误。如果没有像 babel-loader 这样的加载器,我应该如何使用它?有人提到它将模拟 es2015
环境。
ERROR in ./components/App.component.jsx
Module parse failed: /home/krishna/AndroidStudioProjects/jancan/web/components/App.component.jsx Unexpected token (6:1)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (6:1)
at Parser.pp.raise (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15)
at Parser.pp.unexpected (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:603:10)
at Parser.pp.parseExprAtom (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1822:12)
at Parser.pp.parseExprSubscripts (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
at Parser.pp.parseMaybeUnary (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
at Parser.pp.parseExprOps (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
at Parser.pp.parseMaybeConditional (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
at Parser.pp.parseMaybeAssign (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
at Parser.pp.parseParenAndDistinguishExpression (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1861:32)
at Parser.pp.parseExprAtom (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1796:19)
at Parser.pp.parseExprSubscripts (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
at Parser.pp.parseMaybeUnary (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
at Parser.pp.parseExprOps (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
at Parser.pp.parseMaybeConditional (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
at Parser.pp.parseMaybeAssign (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
at Parser.pp.parseFunctionBody (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:2098:24)
at Parser.pp.parseArrowExpression (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:2087:10)
at Parser.pp.parseParenArrowList (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1902:17)
at Parser.pp.parseParenAndDistinguishExpression (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1870:21)
at Parser.pp.parseExprAtom (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1796:19)
at Parser.pp.parseExprSubscripts (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
at Parser.pp.parseMaybeUnary (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
at Parser.pp.parseExprOps (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
at Parser.pp.parseMaybeConditional (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
at Parser.pp.parseMaybeAssign (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
at Parser.pp.parseVar (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1034:28)
at Parser.pp.parseVarStatement (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:917:10)
at Parser.pp.parseStatement (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:706:19)
at Parser.pp.parseTopLevel (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:638:25)
at Parser.parse (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:516:17)
@ multi main
编辑
我的 webpack 配置
module.exports = {
entry: ['babel-polyfill', './components/App.component.jsx'],
output: {
path: 'dist/',
filename: "bundle.js"
},
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel', // 'babel-loader' is also a valid name to reference
query: {
presets: ['es2015','react']
}
}
]
};
我已经添加了 babel-loader,但我仍然遇到同样的错误
这就是我在 Webpack 配置中使用 babel-polyfill 的方式。
entry: {
app: ['babel-polyfill', 'main']
}
我在尝试将 babel-polyfill 与 webpack 一起使用时,不断遇到以下 错误。如果没有像 babel-loader 这样的加载器,我应该如何使用它?有人提到它将模拟 es2015
环境。
ERROR in ./components/App.component.jsx
Module parse failed: /home/krishna/AndroidStudioProjects/jancan/web/components/App.component.jsx Unexpected token (6:1)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (6:1)
at Parser.pp.raise (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15)
at Parser.pp.unexpected (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:603:10)
at Parser.pp.parseExprAtom (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1822:12)
at Parser.pp.parseExprSubscripts (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
at Parser.pp.parseMaybeUnary (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
at Parser.pp.parseExprOps (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
at Parser.pp.parseMaybeConditional (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
at Parser.pp.parseMaybeAssign (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
at Parser.pp.parseParenAndDistinguishExpression (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1861:32)
at Parser.pp.parseExprAtom (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1796:19)
at Parser.pp.parseExprSubscripts (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
at Parser.pp.parseMaybeUnary (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
at Parser.pp.parseExprOps (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
at Parser.pp.parseMaybeConditional (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
at Parser.pp.parseMaybeAssign (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
at Parser.pp.parseFunctionBody (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:2098:24)
at Parser.pp.parseArrowExpression (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:2087:10)
at Parser.pp.parseParenArrowList (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1902:17)
at Parser.pp.parseParenAndDistinguishExpression (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1870:21)
at Parser.pp.parseExprAtom (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1796:19)
at Parser.pp.parseExprSubscripts (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1715:21)
at Parser.pp.parseMaybeUnary (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
at Parser.pp.parseExprOps (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
at Parser.pp.parseMaybeConditional (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
at Parser.pp.parseMaybeAssign (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
at Parser.pp.parseVar (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:1034:28)
at Parser.pp.parseVarStatement (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:917:10)
at Parser.pp.parseStatement (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:706:19)
at Parser.pp.parseTopLevel (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:638:25)
at Parser.parse (/home/krishna/AndroidStudioProjects/jancan/web/node_modules/webpack/node_modules/acorn/dist/acorn.js:516:17)
@ multi main
编辑
我的 webpack 配置
module.exports = {
entry: ['babel-polyfill', './components/App.component.jsx'],
output: {
path: 'dist/',
filename: "bundle.js"
},
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel', // 'babel-loader' is also a valid name to reference
query: {
presets: ['es2015','react']
}
}
]
};
我已经添加了 babel-loader,但我仍然遇到同样的错误
这就是我在 Webpack 配置中使用 babel-polyfill 的方式。
entry: {
app: ['babel-polyfill', 'main']
}