我在webpack上的配置文件遇到了一些问题。
现在我具有以下结构:the stucture
package.json看起来像这样:
{
"name": "webpack-4-tutorial",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack --mode development ./src/index.js --output ./dist/main.js",
"build": "webpack --mode production ./src/index.js --output ./dist/main.js"
},
"author": "Andrii Hordynsky",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"babel-preset-env": "^1.7.0",
"webpack": "^4.16.2",
"webpack-cli": "^3.1.0"
}
}
Index.js只是:console.log("hello, booooiiii");
当我运行'npm run build'时,它会工作并显示以下结果: outcome
我将babel添加为:“ npm install babel-core babel-loader babel-preset-env --save-dev
,它也同样有效:babel
添加.babelrc文件:
{
"presets": [
"env"
]
}
并开始使用以下结构创建webpack.config.js:
// Webpack v4
const path = require('path');
module.exports = {
entry: { main: './src/index.js' },
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'main.js'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
}
]
}
}
并删除
"dev": "webpack --mode development ./src/index.js --output ./dist/main.js",
"build": "webpack --mode production ./src/index.js --output ./dist/main.js"
来自package.json中的“脚本”
现在我有了这个结构: newStructure
而且,当我运行npm run build
时,我期望在/dist/main.js
中有一个小的.js文件,但是我收到了错误堆栈enter image description here
当我仍然从package.json
错误中删除“脚本”时,...
new Errors
很抱歉,如果还有一些不好的英语或文字,只是脑袋完全沸腾了...
答案 0 :(得分:-1)
你忘记添加'.env'文件,如果你刚刚克隆了项目,你的gitignore规则不允许跟踪'.env'文件。