具有一些以前通过Browserify
/ Gulp
编译的代码,并且可以正常工作。但是,我们不会切换到Webpack。资产汇总工作正常。它们被写入磁盘,正确的文件夹等中。
但这在浏览器中访问页面时会导致Uncaught TypeError: (0 , h.default) is not a function
。
该应用程序是基本的React应用程序。
这是Webpack配置文件...
const { join } = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
entry: {
'assets/javascript/bundle': './javascripts/bootstrap_app.js',
'assets/stylesheets/all': './stylesheets/all.scss'
},
output: {
path: join(__dirname, 'build'),
publicPath: '/build'
},
context: join(__dirname, 'client'),
resolve: {
extensions: ['.js', '.jsx'],
},
module: {
rules: [
{
test: /\.(svg|woff|woff2|eot|ttf|otf)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: './fonts'
}
},
{
test: /\.(png|gif|jpeg|jpg|svg|ico)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: './assets/images'
}
},
{
test: /\.scss$/,
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'resolve-url-loader',
'sass-loader?sourceMap',
]
},
{
test: /\.jsx?$/,
use: 'babel-loader',
exclude: /node_modules/
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: 'views/index.handlebars',
filename: 'views/index.handlebars'
}),
new MiniCssExtractPlugin({
filename: '[name].css',
})
]
};
还有我的.babelrc
文件。
{
"presets": [
"es2015",
"react",
"stage-0"
],
"env": {
"test": {
"plugins": ["rewire"]
},
"test-cov": {
"plugins": ["istanbul", "rewire"]
}
},
"plugins": [
"transform-function-bind",
"transform-decorators-legacy"
]
}
运行"build": "./node_modules/webpack-cli/bin/cli.js --config ./webpack.config.js --display-error-details",
时,一切正常。没有错误消息。
但是打开浏览器时,出现以下错误:
Uncaught TypeError: (0 , h.default) is not a function
堆栈跟踪
bundle.js:172 Uncaught TypeError: (0 , h.default) is not a function
at Object.<anonymous> (bundle.js:172)
at Object.<anonymous> (bundle.js:172)
at n (bundle.js:1)
at Object.<anonymous> (bundle.js:172)
at n (bundle.js:1)
at Object.<anonymous> (bundle.js:106)
at n (bundle.js:1)
at Object.<anonymous> (bundle.js:106)
at n (bundle.js:1)
at bundle.js:1
在单击第一条错误消息时..错误发生在...附近...
window.jQuery=u.default,(0,h.default)(u.default);