运行webpack报错信息：element.loader.split is not a function

Posted 2023-03-07

【中文标题】运行webpack报错信息：element.loader.split is not a function

【英文标题】：Run webpack error information: element.loader.split is not a function

【发布时间】：2017-11-02 03:47:18

【问题描述】：

我在项目中使用了babel-plugin-import，是用来实现ant design的按需加载，但是我运行webpack的时候，出现了错误信息

以下是错误提示

/usr/local/lib/node_modules/webpack/node_modules/webpack- 核心/lib/LoadersList.js:58

if(element.loader) return element.loader.split("!");

TypeError: element.loader.split 不是函数

这是我的代码

webpack-config.js

module.exports = 
    entry:  __dirname + "/src/main.js",
    output: 
        path: __dirname + "/dist/js",
        filename: "weitac-visual-layout.js"
    ,
    module: 
        loaders: [
            
                test: /\.js?$/,
                loader: 'babel-loader',
                query: 
                    presets: ['react', 'es2015','stage-1'],
                    plugins: [
                        ["import", "libraryName": "antd", "style": "css"]
                    ]
                ,
            ,
            
                test: /\.css?$/,
                loader: ['style-loader','css-loader'],
            

        ]
    

package.json

 "devDependencies": 
    "babel-loader": "^7.0.0",
    "babel-plugin-import": "^1.2.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-1": "^6.24.1",
    "babel-preset-stage-3": "^6.24.1",
    "react-router-dom": "^4.1.1",
    "webpack": "^2.5.1",
    "webpack-dev-server": "^2.4.5"
  ,
  "dependencies": 
    "antd": "^2.10.1",
    "babel-core": "^6.24.1",
    "prop-types": "^15.5.10",
    "react": "^15.5.4",
    "react-dom": "^15.5.4",
    "react-router": "^4.1.1"
  

【参考方案1】：

我发现流程问题

以下是正确的代码

 
    test: /\.css?$/,
    loader: 'style-loader!css-loader',
 

我太粗心了，祝大家儿童节快乐~