webpack-config

  var path = require('path');
  var ExtractTextPlugin = require("extract-text-webpack-plugin");
  var HtmlWebpackPlugin = require('html-webpack-plugin');
  var webpack = require('webpack');
  var UglifyJSPlugin = require('uglifyjs-webpack-plugin');
  var OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');

  module.exports = {
    entry: {
       'index':'./app/index.js',
        'css':'./app/index.less'
    },
    resolve:{
        extensions:['.js'],
        alias: {
      //设置全局jquery插件;
         jquery:  path.resolve(__dirname,'./bower_components/jquery/dist/jquery.js') //绝对路径;
      },
     module: {
          rules: [
         {
            test: /\.html$/,
            use: ['html-loader']
        },
        {
            test: /\.(png|jpg|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?[\s\S]+)?$/,
            use: "file-loader?name=[name][hash].[ext]&outputPath=images/"
        },
        {
            test: /\.less$/,
            use: ExtractTextPlugin.extract({
                fallback: 'style-loader',
                //resolve-url-loader may be chained before sass-loader if necessary
                use: ['css-loader', 'less-loader']
              })
          }
      ]} ,
      plugins: [
            new ExtractTextPlugin({
              filename:"styles.css",
              allChunks:true            }),
            new HtmlWebpackPlugin({
              title:'hello',
              filename: 'test.html',
              template: 'app/index.html'            }),
          new webpack.optimize.CommonsChunkPlugin({
              name: ['index']       }),
          new UglifyJSPlugin(),
          new webpack.ProvidePlugin({
               $: 'jquery'     }),                         //文件里遇见‘$’加载jquery 
          new OptimizeCssAssetsPlugin({
               assetNameRegExp: /\.css$/g,                //正则匹配后缀.css文件;
              cssProcessor: require('cssnano'),            //加载‘cssnano’css优化插件;
              cssProcessorOptions: { discardComments: {removeAll: true }               }, //插件设置,删除所有注释;
            canPrint: true                             //设置是否可以向控制台打日志,默认为true;
        } ) ],
        devServer: {
              stats: 'errors-only',
              contentBase:'./',
              disableDotRule:true
        },
        output: {
            filename: '[name].js',
            path: path.resolve(__dirname, 'dist'),
            chunkFilename:'js/[name].js'
      }
  };

你可能感兴趣的:(webpack-config)