The simplest language clearly explains chmod and Linux permissions and how the Vue project is deployed in the subdirectory of nginx

1. What is the authority

• Enter llor ls -l command to see that there is a similar thing in front of each directory or file:
  such as: drwxr-xr-- a total of 10 characters, respectively indicating
  the first character: d means this is a directory, if the first character is The "-" symbol means that it is a file
  , and the next 9 characters are grouped into 3 groups, which respectively represent:
  the first group: representing the user himself The second group: the third group
  of users who are in the same group as the user himself
  : Other users
  Then, the above drwxr-xr-x ignores the first "d" character, and the rest means:
  • 1. The first group: rwx means that the user himself has r (read) w (write) and x (execute) permissions
  • 2. The second group: r - x means that the group user has r (read) and x (execute) permissions, but no w (write) permissions
  • 3. The third group: r- - means other users, only r (read) permission
       

2. How to change it?

• First of all, you need to know the code corresponding to rwx:
  r=read code 4
  w=write code 2
  x=execute code 1

• Use the chmod command to give a three-digit number, for example:
  now give the deity all permissions (rwx), calculate the first digit: rwx is 4+2+1 = 7
  to give the user group read and execute (rx) permissions, Calculate the second digit: r - x is: 4+0+1 = 5
  for other users to read permission ®, calculate the third digit: r - - is: 4+0+0 = 4 and then we use
  :
  chmod 754 filename
  The permissions of filename or a directory name have been modified as required.
  Or:
  chmod -R 754 dirname[-R means to change all files in a subdirectory to 754 permissions]

---

3. How to deploy the Vue project in the root directory of the server

Ok, now back to the problem that the vue deployment cannot be accessed under the server subdirectory.
Need to pay attention to these places:

Server here:

1. Change the permission of the subdirectory where the vue project is stored to 755:
   chmod -R 755 test(I: read + write + execute group: read + execute other users: read + execute)

2. Nano /usr/local/nginx/conf/nginx.conf
   adds an entry test:

	location /test {
    
    
	alias  /usr/local/nginx/html/test/;
	index  index.html;
	}

3. systemctl restart nginx(restart nginx)

---

Back to vue here:

1. vue.config.js:

const {
    
     defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
    
    
  transpileDependencies: [
    'vuetify'
  ],
  publicPath: '/test/' //加一个publicPath
})

3. main.js

Vue.config.productionTip = true

5. router.js

export default new VueRouter({
    
    
    mode: 'history',
    base: "test", // 加一个base
    routes: []
}) 

4. Matters needing attention

Remember: every time npmbuild or yarn build is compiled and uploaded to the server, you must execute chmod -R 755 test once