Webpack 开发服务器错误创建一个 dist 文件夹
Webpack dev server error creating a dist folder
我想创建一个静态文件夹"dist"
但是我的命令有问题,有没有其他人遇到过同样的问题?
Package.json
"scripts": {
"start": "webpack-dev-server --open",
"dev": "webpack --mode development --watch ./frontend/src/index.js --output ./frontend/static/frontend/main.js",
"build": "webpack --mode production ./frontend/src/index.js --output ./frontend/static/frontend/main.js"
},
Console image error
我的 webpack 配置是
const path = require('path');
const publicPath = '/dist/';
module.exports = {
entry: './index.js',
output: {
path: path.join(__dirname, publicPath),
filename: 'bundle.js',
publicPath: publicPath
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
}
]
}
};
.babelrc 是
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "current"
},
"useBuiltIns": "usage",
"corejs": 3
}
],
"@babel/preset-react"
],
"plugins": [
"@babel/plugin-proposal-class-properties",
"react-hot-loader/babel"
]
}
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';
import { Provider } from 'react-redux';
import store from './store';
const app = (
<Provider store = {store}>
<App />
</Provider>
)
ReactDOM.render(app, document.querySelector('#app'));
注意:我可以使用 npm 运行 dev(因为这直接使用 main)
您的图片显示您正在使用 npm run start
如果您想创建 dist 文件夹,您应该尝试 npm run build
我想创建一个静态文件夹"dist" 但是我的命令有问题,有没有其他人遇到过同样的问题?
Package.json
"scripts": {
"start": "webpack-dev-server --open",
"dev": "webpack --mode development --watch ./frontend/src/index.js --output ./frontend/static/frontend/main.js",
"build": "webpack --mode production ./frontend/src/index.js --output ./frontend/static/frontend/main.js"
},
Console image error
我的 webpack 配置是
const path = require('path');
const publicPath = '/dist/';
module.exports = {
entry: './index.js',
output: {
path: path.join(__dirname, publicPath),
filename: 'bundle.js',
publicPath: publicPath
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
}
]
}
};
.babelrc 是
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "current"
},
"useBuiltIns": "usage",
"corejs": 3
}
],
"@babel/preset-react"
],
"plugins": [
"@babel/plugin-proposal-class-properties",
"react-hot-loader/babel"
]
}
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';
import { Provider } from 'react-redux';
import store from './store';
const app = (
<Provider store = {store}>
<App />
</Provider>
)
ReactDOM.render(app, document.querySelector('#app'));
注意:我可以使用 npm 运行 dev(因为这直接使用 main)
您的图片显示您正在使用 npm run start
如果您想创建 dist 文件夹,您应该尝试 npm run build