我正在构建一个SSR模板,当我使用@ babebl / register然后执行webpack(配置)时,系统报告了一个错误。 我尝试了@ babel / polyfill和@ babel / plugin-transform-runtime,但是它们都不起作用。
通天塔版本:7.4.3 节点/ npm版本:[例如节点10.15.3 / npm 6.4.1] 操作系统:窗口10
index.js:
require("ignore-styles");
require("@babel/register")({
ignore: [/\/(build|node_modules)\//],
presets: ["@babel/preset-env", "@babel/preset-react"],
plugins: ["@babel/plugin-syntax-dynamic-import", "dynamic-import-node"]
});
require("./server");
server.js
const config = require('../config/webpack.dev.config.js')
const webpack = require('webpack')
const express = require('express')
const webpackDevMiddleware = require('webpack-dev-middleware')
const reactRouter = require('react-router')
const StaticRouter = reactRouter.reactRouter;
const app = express()
const complier = webpack(config)
const PORT = 8090
...
app.use(webpackDevMiddleware(complier, {
publicPath: config.output.publicPath
}))
app.listen(PORT , function() {
console.log(`SSR running on port ${PORT }`);
})
webpack.dev.config.js
const paths = require('./paths')
const webpack = require('webpack')
const htmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
entry: ['webpack-hot-middleware/client?reload=true', paths.appIndexJs],
output: {
path: paths.clientBuild,
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js',
publicPath: paths.publicPath
},
devtool: 'eval-source-map',
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: 'babel-loader',
options: {
presets: [
['@babel/preset-env', {
useBuiltIns: 'usage',
corejs: "2",
targets: {
browsers: ['last 2 versions', 'ie >= 9'],
},
}],
'@babel/preset-react'
]
}
}
]
},
resolve: {
extensions: ['.js', '.jsx']
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new htmlWebpackPlugin({
template: './client/index.html',
filename: 'index.html'
})
]
}
https://github.com/xuchenchenBoy/ssr(请执行npm run dev:server并在server.js中发行说明)