react-graphql/webpack.dev.js at master · tzuser/react-graphql · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
const path = require('path');
const webpack = require('webpack');
const HTMLWebpackPlugin = require('html-webpack-plugin'); //html生成
const { ReactLoadablePlugin } = require('react-loadable/webpack');
const configBase = require('./webpack.base.js');
const merge = require('webpack-merge');
//获取本机ip
function getIPAdress() {
  //return '192.168.56.1'
  var interfaces = require('os').networkInterfaces();
  for (var devName in interfaces) {
    var iface = interfaces[devName];
    for (var i = 0; i < iface.length; i++) {
      var alias = iface[i];
      if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
        return alias.address;
      }
    }
  }
}

const config = {
  optimization: {
    runtimeChunk: {
      name: 'manifest',
    },
    splitChunks: {
      cacheGroups: {
        commons: {
          test: /[\\/]node_modules[\\/]/,
          name: 'vendor',
          chunks: 'all',
        },
      },
    },
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          {
            loader: 'style-loader',
          },
          {
            loader: 'css-loader',
          },
        ],
      },
      {
        test: /\.less$/,
        include: /node_modules/,
        use: ['style-loader', 'css-loader', 'less-loader'],
      },
    ],
  },
  devtool: 'eval-source-map',
  mode: 'development',
  devServer: {
    host: getIPAdress(), //localhost
    contentBase: path.join(__dirname, './src'),
    inline: true,
    hot: true,
    open: true,
    port: 5019,
    historyApiFallback: true,

    proxy: [
      {
        context: ['/graphql'],
        target: 'http://localhost:8181',
        changeOrigin: true,
        secure: false,
      },
      {
        context: ['**/*.jpg', '**/*.png', '**/*.pnj', '**/*.gif', '**/*.mp4'],
        target: 'http://localhost:8181',
        changeOrigin: true,
        secure: false,
      },
    ],
    watchOptions: {
      //监听配置变化
      aggregateTimeout: 300,
      poll: 1000,
    },
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(), //热加载
  ],
};

module.exports = merge(configBase, config);