React Server Side Rendering webpack-hot-middleware

时间:2018-06-09 17:13:57

标签: node.js reactjs webpack

我有一个服务器端渲染应用程序,我正在尝试弄清楚如何为此实现热重新加载,这与webpack-dev-server为您所做的相同。

我遇到了webpack.config。我试图实现这一点,但没有成功。这是我serverConfig中的内容。我在同一个文件中也有一个名为const isProduction = (process.env.NODE_ENV === 'production'); const clientConfig = { entry: [ 'webpack-hot-middleware/client?http://localhost:3000', './src/client/index.js', ], output: { path: path.join(__dirname, 'public'), filename: 'bundle.js', publicPath: '/public' }, module: { rules: [ { loader: 'babel-loader', test: /\.js$/, exclude: /node_modules/ }, { test: /\.s?css$/, use: ExtractTextPlugin.extract({ fallback: 'style-loader', use: [{ loader: 'css-loader', options: { sourceMap: true, importLoaders: 2 } }, { loader: 'postcss-loader', options: { plugins: [autoprefixer()], sourceMap: true } }, { loader: 'sass-loader', options: { sourceMap: true } }] }) } ] }, devtool: isProduction ? 'source-map' : 'inline-source-map', optimization: { minimizer: [ new UglifyJsPlugin({ test: /\.js$/, exclude: /node_modules/, parallel: true, sourceMap: true, cache: true, }), new OptimizeCSSAssetsPlugin({}) ] }, plugins: [ new ExtractTextPlugin('styles.css'), new webpack.DefinePlugin({ ISCLIENT: "true" }), new webpack.HotModuleReplacementPlugin(), new webpack.NoEmitOnErrorsPlugin() ], 的配置,用于服务器端渲染。

const webpack       = require('webpack');
const webpackConfig = require('../../webpack.config');
const compiler      = webpack(webpackConfig);

app.use(require("webpack-dev-middleware")(compiler, {
    noInfo: true, 
    publicPath: webpackConfig.output.publicPath
}));
app.use(require("webpack-hot-middleware")(compiler));

};

我的server.js

dev

我从package.json

运行 "scripts": { "dev": "npm-run-all --parallel dev:*", "dev:server": "nodemon --watch build --exec \"node build/server.js\"", "dev:build-server-client": "webpack --mode development --watch", "build:dev": "webpack --mode development", "build:prod": "cross-env NODE_ENV=production webpack -p", "start": "node build/server.js", "heroku-postbuild": "npm run build:prod" }, 脚本
dev

出于某种原因,每当我运行dev:serverwebpack-hot-middleware脚本时,节点总是给我一个错误: '提供的值" \\ public"不是一条绝对的道路。 '提供的值" \\ build"不是一条绝对的道路。 << serverConfig中

有趣的是,当我删除与select distinct 'Category' as parent, 'Subcategory' as child from (select distinct category, subcategory from otm) as cols group by category having count(subcategory) > 1 union select distinct 'Subcategory' as parent, 'Category' as child from (select distinct category, subcategory from otm) as cols group by subcategory having count(category) > 1 union select distinct 'Category' as parent, 'Product' as child from (select distinct category, product from otm) as cols group by category having count(product) > 1 union select distinct 'Product' as parent, 'Description' as child from (select distinct product,description from otm) as cols group by product having count(description) > 1; 相关的所有内容时,一切正常,当然没有热重定位部分。任何人都知道这里的问题是什么?

0 个答案:

没有答案