gpt4 book ai didi

javascript - Webpack Babel 加载错误 - Uncaught SyntaxError : Unexpected token import

转载 作者:可可西里 更新时间:2023-11-01 02:17:21 25 4
gpt4 key购买 nike

<分区>

我是 Webpack 的新手,在 this tutorial 之后遇到了问题.

似乎 webpack.config.js 没有正确设置 babel-loader 但我不确定。在控制台中我看到以下错误:

bundle.js:49 Uncaught SyntaxError: Unexpected token import

这是指 import sortBy from 'lodash/collection/sortBy'; 我的 index.js 行。所以我假设这是一个 babel transpiling 问题(不允许 ES6 的 import 语法?)

这是完整的index.js文件

import sortBy from 'lodash/collection/sortBy';
import {users} from './users';
import {User} from './User';

sortBy(users, 'name')
.map(user => {
return new User(user.name, user.age);
})
.forEach(user => {
console.log(user.display);
});

webpack.config.js 看起来像这样:

module.exports = {
entry: './src/index.js',
output: {
path: './public/',
filename: 'bundle.js'
},
devServer: {
contentBase: './public/'
},
module: {
loaders: [
{test: /\.js$/, exclude: /node_modules/, loader: 'babel'}
]
}
}

我搜索了其他看起来与问题 here 相关的问题和 here以及谷歌搜索但还没有找到解决方案或我收到错误的原因。也许本教程已过时。非常感谢任何如何解决此问题的指导!

更新

按照 Alexandre Thebaldi 在下面发布的答案中概述的步骤解决了特定的 babel 加载错误。

然而,出现了新的错误——找不到模块:错误:无法解析模块“lodash/collection/sortBy”

如果您正在处理 this tutorial遇到这个错误,很有可能是因为index.js中的路径不正确,特别是lodash/collections目录好像已经不存在了。我设法通过简单地将路径更改为 lodash/sortBy 来解决第二个错误。

注意

请务必先检查 lodash 是否安装在 node_modules 中,并且在更改之前手动检查路径是否正确。

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com