webpack打包vue配置

標籤：ttf   css   test   name   輸出   plugins   pre   var   require   

/* 引入操作路徑模組和webpack */var path = require(‘path‘);var webpack = require(‘webpack‘);module.exports = {  /* 輸入檔案 */  entry: {    index:‘./src/main.js‘  },  output: {    /* 輸出目錄，沒有則建立 */    path: path.resolve(__dirname, ‘./dist‘),    /* 靜態目錄，可以直接從這裡取檔案 */    publicPath: ‘/dist/‘,    /* 檔案名稱 */    filename: ‘build.js‘  },  module: {    rules: [      /* 用來解析vue尾碼的檔案 */      {        test: /\.vue$/,        loader: ‘vue-loader‘      },      /* 用babel來解析js檔案並把es6的文法轉換成瀏覽器認識的文法 */      {        test: /\.js$/,        loader: ‘babel-loader‘,        /* 排除模組安裝目錄的檔案 */        exclude: /node_modules/      },      /*解析圖片url*/      {        test: /\.(png|jpg|gif)$/,        loader:‘url-loader?limit=8192‘      },      /*解析css*/      {        test: /\.css$/,        loader: ‘style-loader!css-loader‘      },      {        test: /\.(eot|woff|woff2|ttf|svg)$/,        loader: ‘url-loader‘      }    ]  },  resolve: {    alias: {      ‘vue$‘: ‘vue/dist/vue.esm.js‘    }  },  plugins : [    new webpack.ProvidePlugin({      $: "jquery",      jQuery: "jquery",      "window.jQuery": "jquery"    })  ]}

　　

webpack打包vue配置