У меня возникла очень неприятная проблема, когда мое webpack-hot-middleware не является «горячей перезагрузкой». Он строит проект и перестраивает проект, когда я делаю какие-либо изменения в любом из моих файлов, но он, кажется, никогда не показывает никаких изменений и всегда отображает мои файлы до внесенных им изменений (почти так же, как это кэширует их или что нибудь).Webpack Hot Middleware не горячая перезагрузка на Ubuntu с реакцией?
Я также использую сервер Express, и я очень новичок в этом. Я на самом деле пытаюсь настроить среду разработки, используя файлы, которые были переданы мне от работодателя, и мне трудно найти способы решить эту проблему.
Мой package.json запускает эти сценарии:
"scripts": {
"postinstall": "npm run prod",
"prod": "webpack --config ./webpack.prod.config.js",
"start": "node ./app_build.js"
}
после "НОЙ установки", по-видимому, чтобы запустить этот файл "webpack.prod.config.js":
const path = require('path');
const webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = {
devtool: 'source-map',
entry: './main.js',
output: {
path: path.join(__dirname,'prod'),
filename: 'bundle.js',
publicPath: '/'
},
plugins:[
new webpack.DefinePlugin({
'process.env':{
NODE_ENV: JSON.stringify('production'),
}
}),
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin({
minimize: true,
compress:{
warnings:false
}
}),
new ExtractTextPlugin('bundle.css'),
new webpack.IgnorePlugin(/^(buffertools)$/) //Remove deeper dependancy for react-jsonschema-forms error
],
module: {
loaders: [
{ test: /\.js$/,
loader: 'babel',
exclude: /node_modules/,
query: {
presets: ['es2015', 'react'] }},
{ test: /\.css?$/,
loader: ExtractTextPlugin.extract('style', 'css')},
{ test: /\.less$/,
loader: 'style!css!less' },
{ test: /\.(png|jpg|gif)$/,
loader: 'url-loader?limit=100000' },
{
test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/font-woff"
}, {
test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/font-woff"
}, {
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=application/octet-stream"
}, {
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
loader: "file"
}, {
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
loader: "url?limit=10000&mimetype=image/svg+xml"
}
]
}
};
An «NPM старт» запускает «app_build.js», который выглядит следующим образом:
const Server = require('./server.js');
const port = (process.env.PORT || 3333);
const app = Server.app();
const stormpath = require('express-stormpath');
const path = require('path');
var helpers = require('express-stormpath/lib/helpers');
var uuid = require('node-uuid');
var requestProxy = require('express-request-proxy');
var btoa = require('btoa');
var session = require('express-session');
var request = require('request');
var bodyParser = require('body-parser');
var Mailgun = require('mailgun-js');
request = request.defaults({jar:true});
const CONSTANTS = require('./src/constants/Constants');
//console.log('version: '+ process.env.NODE_ENV);
if (process.env.NODE_ENV !== 'production') {
const webpack = require('webpack');
const webpackDevMiddleware = require('webpack-dev-middleware');
const webpackHotMiddleware = require('webpack-hot-middleware');
const config = require('./webpack.dev.config.js');
const compiler = webpack(config);
app.use(webpackHotMiddleware(compiler));
app.use(webpackDevMiddleware(compiler, {
noInfo: true,
publicPath: config.output.publicPath
}))
console.log(`Listening at http://localhost:${port}`);
}
Существует больше к этому файлу, но я полагаю, что моя проблема имеет S что-то делать с моей публикой или чем-то, я не совсем уверен. Как я уже сказал, мне передали эту конфигурацию от предыдущего разработчика, и я совершенно новичок в этом.
Как выглядит webpack.dev.config.js? – JoseAPL