PublicPath path problems and solutions examples-JS Tutorial-php.cn

PublicPath path problems and solutions examples

零下一度

Release： 2017-06-19 09:21:24

Original

2302 people have browsed it

This article mainly introduces you to the relevant information about the publicPath path problem in the webpack learning tutorial. The article introduces it in detail through the example code, which has certain reference and learning value for everyone. Friends who need it can take a look below. .

This article mainly introduces to you the relevant content about the publicPath path problem in webpack, and shares it for your reference and study. Let’s take a look at the detailed introduction:

output: {
  filename: "[name].js",
  path:path.resolve(dirname,"build")
 }

Copy after login

If publicPath is not specified, the import path is as follows

<body>
 <script src="b.js"></script>
</body>

Copy after login

If publicPath is specified

output: {
  filename: "[name].js",
  path:path.resolve(dirname,"build"),
  publicPath:"/assets/"
 }

Copy after login

, then import As follows

<body>
 <script src="assets/b.js"></script>
</body>

Copy after login

In the webpack-dev-server environment, path, publicPath, differences and connections

path: just specify the compilation directory (/build /js/), cannot be used for jsreference in html.

publicPath: virtual directory, automatically points to the path compilation directory (/assets/ => /build/js/). When referencing js files in html, this virtual path must be quoted (but it actually refers to the file in memory, neither /build/js/ nor /assets/).

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

Publish to the production environment:

1. Compile with webpack (of course compiled to /build/js/)

2. Copy all the files in the compilation directory (/build/js/) to the /assets/ directory (note: do not modify the path referencing bundle.js in index.html)

Previously, webpack-dev-server could not refresh automatically due to the wrong path of publicPath

The above is the detailed content of PublicPath path problems and solutions examples. For more information, please follow other related articles on the PHP Chinese website!