MAC installation and configuration Tomcat

1. Install Tomcat

1. First go to the official website to download Tomcat: https://tomcat.apache.org/download-80.cgi

2. Unzip the tomcat file, you can put it into /Library (in the resource library) through the shortcut key (command+shift+G) 

2. Open Tomcat with the terminal 

1. Open the terminal in the Bin directory

 2. Authorize all operations in the bin directory: terminal input sudo chmod 755 *.sh

sudo chmod 755 *.sh

3. Start Tomcat, enter sudo sh ./startup.sh in the terminal, and press Enter after typing

sudo sh ./startup.sh

补充
sudo sh ./shutdown.sh

 3. Tomcat proxy vue packaged project

1. Modify the index.js file under the config configuration file, change assetsPublicPath from '/' to './', save

For example:

module.exports = {
    publicPath:"./",
    productionSourceMap:false,
    devServer: {
        proxy: {
            "/a": {
                // target: "",
                changeOrigin: true
            }
        }
    }
}

2. After the npm run build of the vue project is packaged, add a vue folder in the webapp directory under tomcat, and
then upload the static and index.html files in the front-end packaged dist file to the vue directory

3. Start tomcat ( sh ./startup.sh ), and then visit localhost:8080/vue in the browser, and the packaged project will appear 

 4. Configure the history mode of vue to refresh the 404 problem

method one:

Solution:
In the ROOT directory, create a new WEB-INFfolder

 The specific content of the file is as follows, which roughly means that when the page is 404, return to the home page:

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" 
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
        http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
        version="3.1" metadata-complete="true">
     <display-name>Router for Tomcat</display-name>
     <error-page>
        <error-code>404</error-code>
        <location>/index.html</location>
    </error-page>
</web-app>

2. After the configuration is complete, tomcat needs to be restarted, and the problem is solved.

Method Two:

1. Production environment configuration in vue.config.js

publicPath:process.env.NODE_ENV==='production'?'/pro':'/', 

 2. The base in src/router/index.js.

mode: 'history',

base: '/pro',

3. Then package npm run build, put the packaged files into the Tomcat server, and restart the service

Replenish:

The linux command chmod 755 means
chmod is a command to set file permissions under Linux, and the following numbers indicate the permissions of different users or user groups.
Generally, there are three numbers:
the first number indicates the permissions of the file owner,
the second number indicates the permissions of other users who belong to the same user group as the file owner, and
the third number indicates the permissions of other user groups.
There are three types of permissions: read (r=4), write (w=2), and execute (x=1). In general, there are readable and executable (rx=5=4+1), readable and writable (rw=6=4+2), readable, writable and executable (rwx=7=4+2+1).
Therefore, chmod 755 sets the permissions of the user as follows:
1. The file owner can read, write and execute--7
2. Other users belonging to the same user group as the file owner can read and execute--5
3. Other user groups can read executable