Package. json files are familiar to those of you who do front-end development, but we rarely pay attention to them. The most familiar ones are the basic properties, such as:

  • Name: project name
  • Version: Indicates the project version number
  • Dependencies, project dependencies package
  • Scripts, NPM command

Json has many other properties that can be configured. Here’s how to use a homepage property.

The function of homepage is to set the following path of the application. After packaging, our project should run under a domain name. Sometimes, it may run under a domain name or a sub-domain name or a directory of the domain name. In this case, we need to set a path, and sometimes our resources will be deployed on the CDN, you must tell the packaging tool what your CDN address is.

For example, the react app developed with create-react-app and the Vue CLI project inherit webpack by default. If the property of homepage is not configured, the file resource application path after the build package is/by default, as shown in the following figure

After you set homepage property, for example, I set homepage to github’s Pages server address

The packaged resource path will have the url of a file added to it. After the React homepage is configured, I package a React project. After the React homepage is packaged, the resource path of the index.html page is as follows:

The full text.