From f7d52c8c92899c96c3a41f0289d223e89f614d4e Mon Sep 17 00:00:00 2001 From: Ihor Kalnytskyi Date: Tue, 26 Dec 2017 21:55:21 +0200 Subject: [PATCH] Set output publicPath in webpack.config.js When 'output.publicPath' is not specified in webpack.config.js, it's assumed that all produced assets (CSS, JS, images) are in the same directory. That means produced 'index.html' will look for them relative to itself. While this is not a problem on its own, it's a problem when one have nested routes in the application. For instance, if someone will try to open some path, say, /foo/bar/baz the webserver will respond with 'index.html' that will look for assets in current directory which is /foo/bar/baz. Obviously, there no such directory so the webserver won't be able to respond with JS/CSS. Fortunately, it could be fixed by settings 'output.publicPath' option that should be considered as a path to assets. When it's set to '/' the assets will be looked at root domain no matter which path was passed in URI. [1] https://webpack.js.org/guides/public-path/ --- webpack.config.js | 1 + 1 file changed, 1 insertion(+) diff --git a/webpack.config.js b/webpack.config.js index 8347f0c..6e9d435 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -32,6 +32,7 @@ module.exports = () => { output: { filename: '[name].[chunkhash].js', path: path.resolve(__dirname, 'dist'), + publicPath: process.env.ASSET_PATH || '/', }, module: {