The front-end should also master the Nginx configuration

1. Multi-project management – Through port

Here we use port 80 and port 8080 as examples

• Port 80

server {
    listen    80;
    server_name www.maiyi.com::80;

    location / {
        root /Users/dist; # Project path
        index index.html index.htm;
        autoindex on;
	try_files $uri $uri/ /index.html; # Project redirection
    }
	
    location ^~ /api/ { # Back-end interface forwarding
	include /usr/local/etc/nginx/fastcgi.conf; fastcgi_intercept_errors on; Proxy_pass http://127.0.0.1:9000; }}Copy the code

• Port 8080

server {
    listen    8080;
    server_name www.maiyi.com::8080;

    location / {
        root /Users/distAdmin; # Project path
        index index.html index.htm;
        autoindex on;
	try_files $uri $uri/ /index.html; # Project redirection
    }
	
    location ^~ /api/ { # Back-end interface forwarding
	include /usr/local/etc/nginx/fastcgi.conf; fastcgi_intercept_errors on; Proxy_pass http://127.0.0.1:9000/; }}Copy the code

Note that the/display at the end of the address in proxy_pass is as follows:

http://127.0.0.1:9000; # = > http://127.0.0.1:9000/api/...
http://127.0.0.1:9000/; # = > http://127.0.0.1:9000/...
Copy the code

2. Refresh the page in Vue History mode

• Configure redirection in nginx: resolve refresh 404 issue

location / {
    #...
    try_files $uri $uri/ /index.html; # Project redirection
}
Copy the code

• Change the package file path to an absolute path: ResolvedUncaught SyntaxError: Unexpected token <An error problem

module.exports = {
    // ...
    publicPath: '/',}Copy the code

3. An error

Nginx: [emerg] unknown directive? In D: \ nginx 1.12.2 / conf/nginx. Conf: 3

The reason is that I used the notebook of my computer. After editing and saving, IT will save the UTF-8 format to UTF-8 Bom format.

---

Nginx: [error] ReadFile () “D: \ PHP \ nginx 1.14.2 / conf/servers /..” failed (1: Incorrect function)

In Windows, an error is reported when nginx is enabled. The reason is that /* exists in the nginx.conf configuration, which is considered unsafe

---