Home > Operation and Maintenance > Nginx > How to solve the problem that nginx deployment vue project cannot find js css files

How to solve the problem that nginx deployment vue project cannot find js css files

王林
Release: 2023-05-16 16:28:06
forward
1455 people have browsed it

nginx部署vue项目找不到js css文件怎么解决

Many times after npm run build, the relative directory of the js file and css file automatically inserted by webpack in the index.html file is always wrong. , after publishing to the server, nginx cannot find the file.

vue-cli@3

In vue-cli@3 you need to insert all the files into index.html for your webpack Add a baseurl. You need to create a new one in the root directory of the project vue.config.js, add the following content:

...
module.exports = {
 baseurl: isprod
  ? '/basexxx/'
  : '/',
  ....
}
Copy after login

What you need to pay attention to here is the dev environment No need to add baseurl.

vue-cli@2

For projects generated by non-vue-cli@3, if you don’t care about how webpack is implemented, you only need to find config/index.js, just modify assetspublicpath in build.

In order to verify whether it is feasible, you can build it locally, and then check whether the path of the js css file referenced in dist/index.html carries the assetspublicpath you just set That’s it.

For students who are concerned about why this setting is enough, continue to look at the build/webpack.base.conf.js file,


nginx部署vue项目找不到js css文件怎么解决

In non-production mode, it is set in config/index.js, where the publicpath defaults to


nginx部署vue项目找不到js css文件怎么解决

The above is the detailed content of How to solve the problem that nginx deployment vue project cannot find js css files. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:yisu.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template