使用" extract-text-webpack-plugin"时出错使用webpack:"模块构建失败:错误:参数'依赖'必须是一个依赖"

时间:2015-12-18 11:02:09

标签: npm webpack webpack-dev-server webpack-style-loader

运行webpack-dev-server时出错

ERROR in ./css/app.scss
Module build failed: Error: Parameter 'dependency' must be a Dependency
    at Compilation.process [as _addModuleChain] (/usr/local/lib/node_modules/webpack-dev-server/node_modules/webpack/lib/Compilation.js:347:9)
    at Compilation.process [as addEntry] (/usr/local/lib/node_modules/webpack-dev-server/node_modules/webpack/lib/Compilation.js:423:7)
    at SingleEntryPlugin.<anonymous> (/Users/roshankarki/Desktop/del_del/wp_tst/node_modules/webpack/lib/SingleEntryPlugin.js:22:15)
    at Compiler.applyPluginsParallel (/usr/local/lib/node_modules/webpack-dev-server/node_modules/webpack/node_modules/tapable/lib/Tapable.js:107:14)
    at Compiler.compile (/usr/local/lib/node_modules/webpack-dev-server/node_modules/webpack/lib/Compiler.js:394:7)
    at Compiler.runAsChild (/usr/local/lib/node_modules/webpack-dev-server/node_modules/webpack/lib/Compiler.js:203:7)
    at Object.module.exports.pitch (/Users/roshankarki/Desktop/del_del/wp_tst/node_modules/extract-text-webpack-plugin/loader.js:81:18)
webpack: bundle is now VALID.

我的webpack.config.js看起来像这样:

var path = require('path');
var ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    /* this defins path where entry files are to be found */
    context: path.resolve('js'),
    entry: ["./utils","./app"], 
    output: {
        /* this is output directory of bundle.js */
        path: path.resolve('build/'),
        /* this is path of directory where bundle will be served in server */
        publicPath: '/public/assets/',
        filename: "bundle.js"
    },

    /* this plugin helps to generate seperate styles.css file rather in once single bundle.js file */
    plugins: [
        new ExtractTextPlugin("styles.css")
    ],

    /* when server is loaded it tells where to look for index file accessed from root */
    devServer: {
        contentBase: 'public'
    },

    module: {
        preLoaders: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "jshint-loader"
            }
        ],
        loaders: [
            {
                test: /\.es6$/, 
                exclude: /node_modules/, 
                loader: "babel-loader"
            },
            {
                test: /\.css$/, 
                exclude: /node_modules/ ,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader")
            },
            {
                test: /\.scss$/, 
                exclude: /node_modules/ ,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader!sass-loader")
            }
        ]
    }, 


    /* this will resolve file in common js style require without extension */
    resolve: {
        extensions: ['', '.js', '.es6']
    },

    watch: true

}

在使用此插件之前,一切正常。由于我打算输出不同的css包,我需要解决这个问题。

在github中发现问题,但没有帮助:

https://github.com/webpack/extract-text-webpack-plugin/issues/132

1 个答案:

答案 0 :(得分:0)

好的更新节点对我有用。我通过运行&#34; brew update&#34;和&#34; brew升级&#34;命令,因为我使用自制软件作为软件包管理在mac中。

在git链接中的指令提供我的问题导致错误,因为我在全局安装webpack和webpack-dev-server。我删除它,只有本地副本,最后做了伎俩。

命令列出已安装的节点模块的全局副本:

npm list -g --depth=0

我使用此命令删除全局副本:

npm uninstall -g {replace_with_package_name}

检查本地副本的命令:

npm list --depth=0