运行webpack错误信息:element.loader.split不是函数

时间:2017-06-01 06:27:31

标签: webpack babel

在项目中我使用Babel - 插件 - 导入,用于实现按需加载的ant设计,但是当我运行webpack时,出现错误的信息

以下是错误消息

  

的/ usr /本地/ LIB / node_modules /的WebPack / node_modules / webpack-    core / lib / LoadersList.js:58

     

if(element.loader)返回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 个答案:

答案 0 :(得分:1)

我发现了流程问题

以下是正确的代码

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

我太粗心了,祝大家孩子们快乐〜