在这里反应新手。我刚刚完成了我的第一个 React 应用程序，但在将其投入生产时遇到了问题
目前，我正在尝试运行
NODE_ENV=production webpack -p
在我的package.json文件中有一个脚本。
一切都运行没有问题，但脚本似乎没有输出正确的生产索引.html文件。例如，所有JS和CSS文件都有一个问号，并在它们的末尾附加了随机字符，如下所示
href="/css/app.css?287deee1465dba65696e"
此外，生产索引.html文件似乎只包含我的开发环境中的/src/index.html中写入的内容，但我希望它是/src/App中的内容.js其中编写了我的代码。
我一定在某个地方有所收获，但由于我对 Webpack 和 React 都相当陌生，我不确定从哪里开始寻找。下面是我的索引.js，index.html，以及我的webpack.config的一部分.js其中涉及将代码投入生产。索引.js
//const css = require('./app.scss');
const css = require('./style/style.scss');
import React from 'react';
import ReactDOM from 'react-dom';
import anime from 'animejs';
import {App} from './App.js';
ReactDOM.render(
<App />,
document.getElementById('root')
);
索引.html(来源)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body >
<div id="root">
<h1>Webpack</h1>
</div>
</body>
</html>
webpack.config.js
var isProd = process.env.NODE_ENV === 'production'; //true or false
var cssDev = ['style-loader', 'css-loader', 'sass-loader'];
var cssProd = ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader','sass-loader'],
publicPath: '/dist'
})
var cssConfig = isProd ? cssProd : cssDev;
module.exports = {
entry:{
app: './src/index.js',
slideshow: './src/js/slideshow.js',
shapallax: './src/js/shapallax.js',
yona: './src/js/yona.js',
},
output: {
path: path.resolve(__dirname, "dist"),
// path: __dirname + '/dist',
filename: '[name].bundle.js'
},
我确定我错过了一些细节，这些细节对于解决此问题很有用，因此请让我知道要寻找和询问的正确内容。
我设法找出了相当简单的问题。在我的webpack.config中.js我不得不在我的ExtractTextPlugin设置中更改文件名。删除路径开头的正斜杠后，我能够在我的/dist文件夹中正确输出所有内容。最终的工作设置如下所示。
new ExtractTextPlugin({
filename: 'css/[name].css',
disable: !isProd,
allChunks:true
}),