webpack笔记1

const webpack= require(‘webpack‘);
const path = require(‘path‘);
const HtmlWebpackPlugin= require(‘html-webpack-plugin‘);
const CleanWebpackPlugin = require(‘clean-webpack-plugin‘);

module.exports = {
  entry: {
    main: ‘./src/main.js‘,
　　//工具类放在一个入口
　　//当内容为数组时，将创建多个主入口，生成一个chunk
    vendor: [‘jquery‘,‘angular‘]
  },
  output: {
    filename: ‘[name].[chunkhash].js‘,
    path: path.resolve(__dirname, ‘dist‘),
    publicPath: ‘./‘
  },
  module: {
      rules: [
      {
          test: /\.css$/,
          use: [‘style-loader‘, ‘css-loader‘]
      },{
        test: /\.(png|jpg|gif|svg)$/,
        loader: ‘file-loader‘,
        options: {
              name: ‘[name].[ext]?[hash]‘
        }
    },{
        test: /\.vue$/,
        loader: ‘vue-loader‘,   
        options: {
              loaders: {
            ‘scss‘: ‘vue-style-loader!css-loader!sass-loader‘,
            ‘sass‘: ‘vue-style-loader!css-loader!sass-loader?indentedSyntax‘,
              }
              // other vue-loader options go here
        }
      }
      ]
  },
  plugins: [
    new HtmlWebpackPlugin({
       title: ‘Output Management‘
    }),
    new CleanWebpackPlugin([‘dist‘]),
    new webpack.optimize.CommonsChunkPlugin({
　　　　　　name: ‘vendor‘,
　　　　　　filename: ‘librarys.js‘
      })
  ],
  devtool: ‘source‘
};

const path = require(‘path‘);
const HtmlWebpackPlugin= require(‘html-webpack-plugin‘);
const CleanWebpackPlugin = require(‘clean-webpack-plugin‘)
var ManifestPlugin = require(‘webpack-manifest-plugin‘);
const webpack= require(‘webpack‘);

module.exports = {
  entry: {
    main: ‘./src/main.js‘
  },
  output: {
      //非覆盖更新
    filename: ‘[name].[chunkhash].js‘,
    path: path.resolve(__dirname, ‘dist‘),
    publicPath: ‘./‘
  },
  externals: {
      jquery: ‘jquery‘
    },
  module: {
      rules: [
      {
          test: /\.css$/,
          use: [‘style-loader‘, ‘css-loader‘]
      },{
        test: /\.(png|jpg|gif|svg)$/,
        loader: ‘file-loader‘,
        options: {
              name: ‘[name].[ext]?[hash]‘
        }
    },{
        test: /\.vue$/,
        loader: ‘vue-loader‘,
        options: {
              loaders: {
            ‘scss‘: ‘vue-style-loader!css-loader!sass-loader‘,
            ‘sass‘: ‘vue-style-loader!css-loader!sass-loader?indentedSyntax‘,
              }
        }
      }
      ]
  },
  plugins: [
      new HtmlWebpackPlugin({
       title: ‘Output Management‘
    }),
    new CleanWebpackPlugin([‘dist‘])
  ],
  devtool: ‘source‘
};