2015-09-08 26 views
8

Webpack, daha az sayıda dosyayı bir minified CSS dosyasına aktarmam gereken bir araç mıdır?
eğer öyleyse, aşağıdaki kodda yanlış yaptığımdan emin değilim?
Farklı dosya yollarına çıkış yapmanın bir yolu var, şu anda js dosya çıktıları './assets/javascripts/bundle/''a, css dosyamın './assets/stylesheets/bundle/' çıktısını istiyorum, bunu nasıl yaparım?webpack daha az dosya oluşturuyor bir tane css küçültme dosyası

Güncelleme
Bir test yaptım ve şimdi js girişini yorum var, çıkış klasör için birden çok yol nasıl ayarlanacağını öğrenmek edemez hala bir css dosyasına benim az dosyaları oluşturmak ancak bölüm ve çıkış yolunu değiştirmek ...

webpack yapılandırma

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") 
     } 
    ] 
    }, 
}; 

varlıklar/stil/Medya/Index/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}; 
} 

cevap

5

Neredeyse geldin. Daha önce yaptığınız gibi, tüm stilinizi ExtractTextPlugin kullanarak tek bir css dosyasına alabilirsiniz. J'lerinizi ve css'inizi farklı dizinlere koymak için, ExtractTextPlugin veya output.filename ürünündeki output.path ürününüze göre bir yol tanımlayabilirsiniz. Örneğin:

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

Cevabınız için teşekkürler, bu iş! Ben merak ediyorum css dosya adı javascript dosya adı olarak aynı ayarlamak mümkün, şu anda girişte dosya adından sonra StyleSheet eklemek zorundayım – user1775888

İlgili konular