我正在尝试使用HMR设置Express服务器以及所有babel转换。
但是,当我尝试添加es2015
预设时,代码模块更新不会被推送到HMR。
此BABEL配置工作
{
"presets": [
["env", {"modules": false}]
],
"plugins": [
"transform-class-properties",
"transform-object-rest-spread",
"transform-runtime"
]
}
此BABEL配置不起作用
{
"presets": [
["env", {"modules": false}],
"es2015"
],
"plugins": [
"transform-class-properties",
"transform-object-rest-spread",
"transform-runtime"
]
}
webpack配置文件
const webpack = require('webpack')
const path = require('path')
const nodeExternals = require('webpack-node-externals')
const StartServerPlugin = require('start-server-webpack-plugin')
module.exports = {
mode: "development",
entry: [
'webpack/hot/poll?1000',
'./server/index'
],
watch: true,
target: 'node',
externals: [nodeExternals({
whitelist: ['webpack/hot/poll?1000']
})],
module: {
rules: [{
test: /\.js?$/,
use: 'babel-loader',
exclude: /node_modules/
}]
},
plugins: [
new StartServerPlugin('server.js'),
new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.DefinePlugin({
"process.env": {
"BUILD_TARGET": JSON.stringify('server')
}
}),
],
output: {
path: path.join(__dirname, '.hmr'),
filename: 'server.js'
}
}
的package.json
{
"version": "1.0.0",
"engines": {
"node": ">=7.0",
"npm": ">=3.3 <4"
},
"dependencies": {
"express": "4.14.0",
"express-graphql": "0.5.4",
"express-jwt": "5.0.0",
"express-session": "1.15.2",
"graphiql": "0.7.8",
"graphql": "^0.10.5",
"graphql-relay": "^0.5.2",
"helmet": "3.12.1",
"mongodb": "^2.2.26",
"mongoose": "^4.9.9"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-plugin-transform-runtime": "^6.15.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-env": "^1.7.0",
"babel-register": "^6.26.0",
"start-server-webpack-plugin": "^2.2.5",
"webpack": "^4.12.0",
"webpack-cli": "^3.0.3",
"webpack-node-externals": "^1.7.2"
}
}
我甚至尝试将最新的@babel/preset-env
与最新的babel-loader
一起使用,但代码仍然无法更新。
"devDependencies": {
"@babel/core": "7.0.0-beta.51",
"@babel/preset-env": "7.0.0-beta.51",
"@babel/runtime": "7.0.0-beta.51",
"babel-loader": "8.0.0-beta.3",
"start-server-webpack-plugin": "^2.2.5",
"webpack": "^4.12.0",
"webpack-cli": "^3.0.3",
"webpack-node-externals": "^1.7.2"
}
我正在使用其中一个中间件函数中的console.log
语句来检查更新。使用第一个配置,它会更新并在控制台上打印语句,但后续配置从未起作用。它与最新的Webpack有关吗?任何帮助表示赞赏。