Webpackと外部（ベンダー）.css

Question

私は、Webpackを既存のプロジェクトにゆっくりと持ち込んでいます。この時点では、require .cssファイルはありません。しかし、私はWebpackに依然としてそれらを処理したいと思います。

私はWebpackにファイルをロードし、.cssローダーが必要なもの（この場合はスタイラス）に渡し、.cssファイルを出力します。他のローダーにローダーを渡すExtractTextPluginの組み合わせの

なし、生とファイルローダーは、動作しない、WebPACKのは、必然的に

Module build failed: ParseError: ...bootstrap-theme.min.css:5:1996 
    1| /*! 
    2| * Bootstrap v3.3.5 (http://getbootstrap.com) 
    3| * Copyright 2011-2015 Twitter, Inc. 
... 
expected "indent", got ";" 

をスローし、このようにWebPACKので外部ファイルを処理することも可能ですか？

様々な組み合わせが試さ：

{ 
    test: /\.(styl|css)/, 
    loader: 'raw!stylus' 
    } 

    { 
    test: /\.(styl|css)/, 
    loader: 'file!stylus' 
    } 


    { 
    test: /\.(styl|css)/, 
    loader: ExtractTextPlugin.extract('file', 'raw!stylus') 
    } 


    { 
    test: /\.(styl|css)/, 
    loader: ExtractTextPlugin.extract('style-loader', 'css-loader!stylus-loader') 
    } 

Answer 1

あなたは、スタイラスローダを使って、あなたのCSSファイルを渡すだけ.stylファイルにする必要はありません。

私はそれがこの構成で動作させることができた：

module.exports = { 
    entry: { 
    name: './test.js' 
    }, 
    output: { 
    filename: './bundle.js' 
    }, 
    module: { 
    loaders: [ 
     { 
     test: /\.css$/, 
     loaders: ['style', 'css'] 
     }, 
     { 
     test: /\.styl$/, 
     loaders: ['style', 'css', 'stylus'] 
     }, 
     { 
     test:/\.(woff2?|eot|ttf|svg)$/, 
     loader: 'url' 
     } 
    ] 
    } 
} 

そして、あなたは/あなたのCSSファイルのような必要にインポートすることができます。

require('./test.css'); 
require('./node_modules/bootstrap/dist/css/bootstrap.min.css');