Я понимаю, что эта ошибка возникает, когда в браузере вызывается функция require()
, а не внутри узла.Тем не менее, я не могу понять, что именно мне нужно сделать, чтобы это исправить.Любая помощь будет принята с благодарностью.Вы можете перейти к следующему репозиторию для всей базы кода https://github.com/thegreekjester/React_SSR.
Шаги для запуска и воспроизведения проблемы:
- npm install
- npm run dev
- открыть
localhost:3000
в браузере - Вы увидите ошибку в консоли
Webpack.client.js
const path = require('path');
const webpackNodeExternals = require('webpack-node-externals');
module.exports = {
// production || development
mode: 'development',
// Inform webpack that we're building a bundle
// for nodeJS, rather then for the browser
target: 'node',
// Tell webpack the root file of our
// server application
entry: './src/client.js',
// Tell webpack where to put the output file
// that is generated
output: {
filename: 'client_bundle.js',
path: path.resolve(__dirname, 'build/public'),
publicPath: '/build/public'
},
module: {
rules: [
{
test: /\.js?$/,
loader: 'babel-loader',
exclude: '/node_modules/',
options: {
presets: [
'react', 'stage-0', ['env', {
target: 'web'
}]
]
}
}
]
}
};
Webpack.server.js
const path = require('path');
const webpackNodeExternals = require('webpack-node-externals');
module.exports = {
// production || development
mode: 'development',
// Inform webpack that we're building a bundle
// for nodeJS, rather then for the browser
target: 'node',
// Tell webpack the root file of our
// server application
entry: './server.js',
// Tell webpack where to put the output file
// that is generated
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'build'),
publicPath: '/build'
},
module: {
rules: [
{
test: /\.js?$/,
loader: 'babel-loader',
exclude: '/node_modules/',
options: {
presets: [
'react', 'stage-0', ['env', {
target: { browsers: ['last 2 versions']}
}]
]
}
}
]
},
// Tell webpack not to bundle any libraries that exist in the 'node_modules' folder
// into the server bundle
externals: [webpackNodeExternals()]
};