场景描述: 外网访问开发机是通过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/的时候正常访问热编译的文件。