我是webpack的新手,我只是想让它真正工作。我还没有发现其他人有我的问题,但是每次我尝试npm run build运行webpack时,我都会得到一个错误:
./src/index中的错误。js Module build failed(from ./node_modules/babel-loader/lib/index。js):SyntaxError:C:\Users\bradr\OneDrive\Desktop\repos\weather-app\src\index.js:意外字符'|'。(1:0)
Index.js文件
import { heythere } from "./generateJoke";
console.log(123);
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script src="main.js"></script>
</body>
</html>
首先,我想也许我犯了一个错误,在我的代码或在以下的教程,但我又做了同样的错误来了。然后我开始谷歌搜索,并认为也许我可以改变webpack。config.js文件。
webpack.config.js
const path = require("path");
module.exports = {
entry: "/src/index.js",
output: {
filename: "main.js",
path: path.resolve(__dirname, "dist"),
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"],
},
},
},
],
},
};
但是什么都不起作用,我做的每一个小调整都是同样的错误。
2条答案
按热度按时间b09cbbtk1#
大多数时候,这样的错误意味着你的文件有一些字节在文本编辑器中没有显示为可见字符:
https://www.w3.org/International/questions/qa-utf8-bom.en
某些应用程序在文件的开头插入特定的字节组合,以指示文件中包含的文本是Unicode。这种字节组合称为签名或字节顺序标记(BOM)。某些应用程序(如文本编辑器或浏览器)会将BOM表显示为文件中的额外一行,而其他应用程序则会显示意外字符,如.
例如,您可以在Notepad++的编码菜单中检查文件的编码。
l3zydbqr2#
问题是我的文件是用UTF-16 LE编码的,而不是我设置的默认UTF-8,因此使文件无法被转译器读取。