Quantcast
Channel: CNode:Node.js专业中文社区
Viewing all articles
Browse latest Browse all 14821

wepack 本地开发,线上编译访问

$
0
0

场景描述: 外网访问开发机是通过https://dev.mydomain/user/myname/访问的。我的react开发是本地进行,同步到开发机,开发机热编译,生成资源并提供静态资源文件。 不过开发机的express是起的http服务(7000端口),并通过webpack-dev-middleare起的另一个express服务提供热编译(7001端口)。 需要外网访问开发机地址的时候能正常返回给我express起的http服务上资源。

现有操作如下,开发机的nginx配置代理为: https://mydomain.com/user/myname指向 本地 express服务:7000端口 https://mydomain.com/user/myname/hot-reload指向 webpack-dev-middleware的热加载端口 7001 webpack的主要配置:

var host = 'localhost';
var port = 7001;

entry: {
 'main': [
     'webpack-hot-middleware/client?path=http://' + host + ':' + port + '/__webpack_hmr',
      './src/client.js'
  ]
},
output: {
    path: assetsPath,
    filename: '[name]-[hash].js',
    chunkFilename: '[name]-[chunkhash].js',
    publicPath: 'https://mydomain.com/user/myname/hot-reload/'
  },

webpack-dev-middleware的启动配置:

var serverOptions = {
 contentBase: 'http://' + host + ':' + port,
 https: true,
 quiet: true,
 noInfo: true,
 hot: true,
 inline: true,
 lazy: false,
 publicPath: '/',
 headers: {'Access-Control-Allow-Origin': '*'},
 stats: {colors: true}
};

var app = new Express();

app.use(require('webpack-dev-middleware')(compiler, serverOptions));

启动后,https://mydomain.com/user/myname下的static文件静态资源能够正常访问,外网访问:https://mydomain.com/user/myname加载热编译资源 https://mydomain.com/user/myname/hot-reload/main-bc27c671ef18fa40aff3.js内容无法正常请求到。

问题:如何设置在访问https://mydomain.com/user/myname/的时候正常访问热编译的文件。

Viewing all articles
Browse latest Browse all 14821

Trending Articles