2015-09-08 9 views
8

webpackはいくつかのファイルを1つの縮小CSSファイルに渡す必要がありますか?
もしそうなら、以下のコードで何が間違っているのか分かりません。
別のファイルパスに出力する方法はありますか?現在はjsファイルの出力は'./assets/javascripts/bundle/'です。私のCSSファイルは'./assets/stylesheets/bundle/'に出力したいのですが、どうすればいいですか?webpack build lessファイル出力1つのcss minifyファイル

更新
私がテストを行なったし、私は今、私はJSのエントリをコメントアウトする必要があり、1つのcssファイルへの私の小さいファイルを構築することができますが、それでも、出力フォルダの複数のパスを設定する方法を見つけることができませんパートと出力パスを変更...

WebPACKのコンフィグ

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

module.exports = { 
    entry: { 
    'MediaIndex':['./assets/javascripts/Media/Index/Base.js'], 
    // stylesheets 
    'MediaIndexStyleSheet':['./assets/stylesheets/Media/Index/Base.js'] 
    }, 
    output: { 
    path: './assets/javascripts/bundle/', 
    filename: '[name].js' 
    }, 
    resolve: { 
    alias: { 
     jquery: path.join(__dirname, "assets/javascripts/lib/jquery-1.11.1.min.js"), 
     "jquery-ui": path.join(__dirname, "assets/javascripts/lib/jquery-ui.min.js"), 
    } 
    }, 
    plugins: [ 
    new webpack.ProvidePlugin({ 
     jQuery: "jquery", 
     $: "jquery" 
    }), 
    new ExtractTextPlugin("[name].css") 
    ], 
    module: { 
    loaders: [ 
     { 
     test: /\.css$/, 
     loader: ExtractTextPlugin.extract("style-loader", "css-loader") 
     }, 
     { 
     test: /\.less$/, 
     loader: ExtractTextPlugin.extract("style-loader", "css-loader!less-loader") 
     } 
    ] 
    }, 
}; 

資産/スタイルシート/メディア/インデックス/ Base.js

require('../../../Global/Config.less'); 
require('../../../Global/Fp.less'); 
require('../../../Global/Urb.less'); 
require('../../../Global/Ad1.less'); 
require('./Nav0.less'); 
require('./Index.less'); 
require('./Content.less'); 

Config.less

@color: 'red'; 

Index.less

body { 
    background-color: @{color}; 
} 

答えて

5

あなたはほとんどそこにいます。すでに行ったように、ExtractTextPluginを使用して、すべてのスタイリングを1つのCSSファイルにまとめることができます。 jsとcssを別のディレクトリに配置するには、output.pathに関連するパスをExtractTextPluginまたはoutput.filenameに定義するだけです。例:

output: { 
    path: './assets', 
    filename: './javascripts/bundle/[name].js' 
}, 
plugins: [ 
    new ExtractTextPlugin("./stylesheets/bundle/[name].css") 
] 
+0

返信ありがとうございます!私はそれがJavaScriptファイル名と同じ設定可能なCSSのファイル名は、今すぐ私はエントリでファイル名の後にスタイルシートを追加する必要があるのだろうか? – user1775888

関連する問題