2017-03-08 77 views
0

我的Webpack将我的所有项目编译成一个index.js。我能做些什么来获得“index.js”中的JavaScript代码和“style/index.css”中的CSS代码? 我的webpack.config.js:我能做些什么来获得webpack的输出文件

`
var path = require('path');

module.exports = { 
    entry: './entry.js', 
    output: { 
    filename: 'testApp/www/index.js' 
    }, 
    resolve: { 
    extensions: ['.js', '.jsx', '.json'] 
    }, 
    module: { 
    loaders: [ 
     { test: /\.jsx?$/, 
     loader: 'babel-loader', 
     include: path.resolve(__dirname,` "app"), 
     query: 
     { 
      presets:['react', 'es2015', 'stage-0'] 
     } 
     }, 
     { 
     test: /\.scss$/, 
     loader: 'style-loader!css-loader!sass-loader' 
     } 
    ] 
    } 
}; 

`

+0

您需要使用提取文本的WebPack插件:https://github.com/webpack-contrib/extract -text-的WebPack-插件/斑点/的WebPack-1/README.md –

回答

0

您可以使用ExtractTextPlugin

在控制台上运行npm install --save-dev extract-text-webpack-plugin

在你webpack.config.js

module.exports = { 
    entry: './entry.js', 
    output: { 
    filename: 'testApp/www/index.js' 
    }, 
    resolve: { 
    extensions: ['.js', '.jsx', '.json'] 
    }, 
    module: { 
    loaders: [ 
     { test: /\.jsx?$/, 
     loader: 'babel-loader', 
     include: path.resolve(__dirname, "app"), 
     query: 
     { 
      presets:['react', 'es2015', 'stage-0'] 
     } 
     }, 
     { 
     test: /\.scss$/, 
     loader: ExtractTextPlugin.extract({ 
       fallback: 'style-loader', 
       use: ['css-loader', 'sass-loader'] 
      }) 
     } 
    ] 
    }, 
    plugins: [ 
    new ExtractTextPlugin('style/index.css') 
    ], 
}; 
相关问题