我正在学习 react ,我遵循的在线类(class)使用webpack。我没有在我的webpack.config中添加任何缩小或丑陋的选项,但是我的bundle.js仍然被缩小了。我不确定为什么或如何将其关闭。我已经附上了我的webpack.config.js和package.json。谢谢你的帮助。
const path = require('path');
module.exports = {
entry: './src/app.js',
output: {
path: path.join(__dirname, 'public'),
filename: 'bundle.js'
},
module: {
rules: [{
loader: 'babel-loader',
test: /\.js$/,
exclude: /node_modules/
}, {
test: /\.s?css$/,
use: [
'style-loader',
'css-loader',
'sass-loader'
]
}]
},
devtool: 'cheap-module-eval-source-map',
devServer: {
contentBase: path.join(__dirname, 'public'),
historyApiFallback: true
}
};
{
"name": "expensify",
"version": "1.0.0",
"description": "learn react",
"main": "index.js",
"author": "powpowpow",
"license": "MIT",
"scripts": {
"serve": "live-server public",
"build": "webpack",
"dev-server": "webpack-dev-server"
},
"dependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"css-loader": "^0.28.11",
"live-server": "^1.2.0",
"node-sass": "^4.8.3",
"normalize.css": "^8.0.0",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-modal": "^3.3.2",
"react-router-dom": "^4.2.2",
"sass-loader": "^6.0.7",
"style-loader": "^0.20.3",
"webpack": "^4.2.0",
"webpack-cli": "^2.0.13",
"webpack-dev-server": "^3.1.1"
}
}
最佳答案
您正在使用没有模式设置的webpack 4。通常,您应该具有以下警告:
WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn
more: https://webpack.js.org/concepts/mode/
在您的conf中添加
mode: development
以禁用缩小和此警告。