首页 > 解决方案 > Webpack:TypeError 默认不是函数

问题描述

有一些以前通过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);

标签: javascriptwebpack

解决方案


推荐阅读