代码之家  ›  专栏  ›  技术社区  ›  Danziger

Webpack抛出TypeError:当导入更少的文件时,超级表达式必须为null或函数,而不是未定义的

  •  0
  • Danziger  · 技术社区  · 7 年前

    我有以下文件 initialize.js

    import App from './components/App';
    
    import './styles/application.less';
    
    document.addEventListener('DOMContentLoaded', () => {
        const app = new App();
    
        app.start();
    });
    

    在里面 webpack.config.js 我有:

    'use strict';
    
    const path = require('path');
    
    const webpack = require('webpack');
    const merge = require('webpack-merge');
    
    const ProvidePlugin = webpack.ProvidePlugin;
    const ModuleConcatenationPlugin = webpack.optimize.ModuleConcatenationPlugin;
    const ExtractTextPlugin = require('extract-text-webpack-plugin');
    const CopyWebpackPlugin = require('copy-webpack-plugin');
    
    const extractLess = new ExtractTextPlugin({
        filename: 'app.css',
    });
    
    const webpackCommon = {
        entry: {
            app: ['./app/initialize']
        },
        module: {
            rules: [{
                test: /\.js$/,
                exclude: /node_modules/,
                use: [{
                    loader: 'babel-loader?presets[]=es2015'
                }]
            }, {
                test: /\.hbs$/,
                use: {
                    loader: 'handlebars-loader'
                }
            }, {
                test: /\.less$/,
                exclude: /node_modules/,
                use: extractLess.extract({
                    use: [{
                        loader: 'css-loader'
                    }, {
                        loader: 'less-loader'
                    }],
                    // use style-loader in development
                    fallback: 'style-loader'
                }),
            }]
        },
        output: {
            filename: 'app.js',
            path: path.join(__dirname, './public'),
            publicPath: '/'
        },
        plugins: [
            extractLess,
            new CopyWebpackPlugin([{
                from: './app/assets/index.html',
                to: './index.html'
            }]),
            new ProvidePlugin({
                $: 'jquery',
                _: 'underscore'
            }),
            new ModuleConcatenationPlugin(),
        ],
    };
    
    module.exports = merge(webpackCommon, {
        devtool: '#inline-source-map',
        devServer: {
            contentBase: path.join(__dirname, 'public'),
            compress: true,
            port: 9000
        }
    });
    

    application.less ,但我一直遇到这个错误:

    ERROR in ./node_modules/css-loader!./node_modules/less-loader/dist/cjs.js!./app/styles/application.less
    
    Module build failed: TypeError: Super expression must either be null or a function, not undefined
    at ...
    @ ./app/styles/application.less 4:14-127
    @ ./app/initialize.js
    

    如果我换掉它 LESS 使用文件 CSS 一个并更新配置,它工作正常,所以我想问题与 less-loader

    我正在使用Webpack 3.4.1 0.18.2 ,装载机更少 4.0.5 3.0.0 css-loader .

    1 回复  |  直到 7 年前
        1
  •  2
  •   Danziger    7 年前

    我的错,我没有注意到我在用一个旧的 less 2.7.2 问题已经解决了。