描述:webapck基本配置文件. 为了给开发文件和打包文件(webpack.dev.conf.js|| webpack.prod.conf.js) 提供方便.
1 'use strict'
2 // 路径
3 const path = require('path')
4 // build/utils.js
5 const utils = require('./utils')
6 // config/index.js
7 const config = require('../config')
8 // build/vue-loader.conf.js
9 const vueLoaderConfig = require('./vue-loader.conf')
10
11 function resolve(dir) {
12 return path.join(__dirname, '..', dir)
13 }
14
15
16 module.exports = {
17 context: path.resolve(__dirname, '../'),
18 // 入口
19 entry: {
20 app: './src/main.js'
21 },
22 // 出口
23 output: {
24 path: config.build.assetsRoot,
25 filename: '[name].js',
26 publicPath: process.env.NODE_ENV === 'production'
27 ? config.build.assetsPublicPath
28 : config.dev.assetsPublicPath
29 },
30 // 详情可以看看这篇文章:http://www.php.cn/js-tutorial-385863.html
31 resolve: {
32 extensions: ['.js', '.vue', '.json'],
33 alias: {
34 'vue$': 'vue/dist/vue.esm.js',
35 '@': resolve('src'),
36 }
37 },
38 // 模块
39 module: {
40 rules: [
41 {
42 test: /.vue$/,
43 loader: 'vue-loader',
44 options: vueLoaderConfig
45 },
46 {
47 test: /.js$/,
48 loader: 'babel-loader',
49 include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
50 },
51 {
52 test: /.(png|jpe?g|gif|svg)(?.*)?$/,
53 loader: 'url-loader',
54 options: {
55 limit: 10000,
56 name: utils.assetsPath('img/[name].[hash:7].[ext]')
57 }
58 },
59 {
60 test: /.(mp4|webm|ogg|mp3|wav|flac|aac)(?.*)?$/,
61 loader: 'url-loader',
62 options: {
63 limit: 10000,
64 name: utils.assetsPath('media/[name].[hash:7].[ext]')
65 }
66 },
67 {
68 test: /.(woff2?|eot|ttf|otf)(?.*)?$/,
69 loader: 'url-loader',
70 options: {
71 limit: 10000,
72 name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
73 }
74 }
75 ]
76 },
77 node: {
78 //阻止webpack注入无用的setImmediate polyfill,因为Vue
79 // source包含它(尽管只有它是原生的才使用它)。
80 setImmediate: false,
81 //阻止webpack向模块本机模块注入模拟
82 //对客户没有意义
83 dgram: 'empty',
84 fs: 'empty',
85 net: 'empty',
86 tls: 'empty',
87 child_process: 'empty'
88 }
89 }