Как загрузить js, сгенерированный из webpack-dev-middleware, и запустить этот js
Я новичок в Node JS. Я работаю над созданием сервера Backend API с горячей перезагрузкой с помощью webpack-hot-middleware. Я пытаюсь использовать webpack-dev-middleware, чтобы загрузить серверный скрипт (index.js) в память и выполнить этот файл javascrip t.
Вот мой код: ссылка
Я обнаружил, что мой код может успешно выполнить горячую перезагрузку, но мне не удается загрузить серверный скрипт (index.js) и загрузить мой сервер API. По некоторым причинам я хочу использовать webpack-dev-middleware, а не webpack dev server.
Это моя файловая структура:
├── package.json.
├── build
| ├── devserver.js
| └── webpack.devserver.config.js
├── server
| └── index.js (code of the API server)
└── dist
Я нашел тонны учебных пособий о том, как это сделать, на внешнем сервере или на внутреннем сервере, который отображает HTML, но мне нужно запустить свой index.js.
Итак, мой вопрос, как загрузить файл js, сгенерированный из webpack-dev-middleware, и запустить этот файл js.
Ниже я попробую:
const path = require('path');
const express = require('express');
const webpack = require('webpack');
const webpackMiddleware = require('webpack-dev-middleware');
const webpackHotMiddleware = require('webpack-hot-middleware');
const webpackConfig = require('./webpack.devserver.config');
var StreamCache = require('stream-cache');
var fs = require('fs');
const compiler = webpack(webpackConfig);
const app = express();
const hotMiddleware = webpackHotMiddleware(compiler);
const middleware = webpackMiddleware(compiler, {
publicPath: "",
contentBase: 'server',
stats: {
colors: true,
hash: false,
timings: true,
chunks: false,
chunkModules: false,
modules: false
}
});
app.use(middleware);
app.use(hotMiddleware);
middleware.waitUntilValid(() => {
//Then, what should I do??????
console.log(middleware.fileSystem.readFileSync(path.join(__dirname, '../dist/backend.js')));
})
В webpack.devserver.config.js:
var fs = require('fs');
var path = require('path');
var webpack = require('webpack');
var nodeModules = {};
fs.readdirSync('node_modules')
.filter(function (x) {
return ['.bin'].indexOf(x) === -1;
})
.forEach(function (mod) {
nodeModules[mod] = 'commonjs ' + mod;
});
module.exports = {
devtool: 'eval-source-map',
entry: [
'webpack/hot/signal.js',
'./server/index.js'
],
target: 'node',
output: {
path: path.resolve(__dirname, '../dist'),
filename: 'backend.js',
publicPath: ''
},
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.DefinePlugin({
})
],
recordsPath: path.resolve(__dirname, '../dist/a.json'),
resolveLoader: {
moduleExtensions: ['-loader']
},
externals: nodeModules,
watch: true,
module: {
rules: [{
test: /\.js$/,
loader: 'babel-loader'
},
{
test: /\.es6$/,
loaders: ['babel-loader']
},
{
test: /\.json?$/,
loader: 'json'
}
]
}
};
Результат: кажется, что код успешно перезагружен после того, как я что-то изменил в index.js, но я не вижу изменений, когда я получаю доступ к /api/hi API.
webpack building...
webpack built 4f5191c370239429fae8 in 378ms
Version: webpack 3.10.0
Time: 378ms
Asset Size Chunks Chunk Names
backend.js 47 kB 0 [emitted] main
webpack: Compiled successfully.
webpack: Compiling...
webpack building...
webpack built 59489ea86a2ccf081fa6 in 30ms
Version: webpack 3.10.0
Time: 30ms
Asset Size Chunks Chunk Names
backend.js 47.1 kB 0 [emitted] main
0.4f5191c370239429fae8.hot-update.js 1.84 kB 0 [emitted] main
4f5191c370239429fae8.hot-update.json 43 bytes [emitted]
webpack: Compiled successfully.