1. Development environment installation
1. Normal installation (in root mode)
1. Install nodejs
apt install nodejs
2. Check whether nodejs is installed successfully
nodejs -v #会出现版本情况,如:v10.19.0
3. Install npm
apt install npm
4. Check whether npm is installed successfully
npm -v #正常出现版本,如:7.11.2
5. Upgrade npm and install cnpm
#升级 npm
cnpm install npm -g
#安装具体版本的npm
cnpm install npm@7.11.2 -g #-g为全局安装的意思
#安装 cnpm
npm install cnpm -g
6. Install Vue
sudo cnpm install -g vue-cli
7. Check whether Vue is installed successfully
vue -V #类似结果:2.9.6
8. Reference to other tutorials
https://www.cnblogs.com/leemamas/p/13028988.html
https://www.pianshen.com/article/766523200/
https://www.runoob.com/vue3/vue3-install.html
2. Create a project
1. Vue method
vue init webpack vue-test #出现的提示,默认按回车和输入y进行确人就可
2. Install vite and use vite to create projects
cnpm i -g create-vite-app #安装vite
create-vite-app test #创建项目test
3. Start the project
npm install
npm run dev #正常运行如下
4. Frequently Asked Questions
1. Vue installation npm install error
#清楚npm缓存,然后重新安装npm install
npm cache clean --force
2. Enter the wrong folder. It must be the project file you created.
3. Insufficient permissions. If the project is created in root mode, when using vscode to develop and modify, it will prompt that the permissions are insufficient. Every time you are asked to enter the root password, you can upgrade the user to an administrator and develop under the administrator's condition ( Set before environment installation), or modify the owner and group of the file.
Upgrade ordinary user to root user
vim /etc/passwd
#找到自己的用户,将后面的数字改为0 与 0 就是与第一个用户root那个0 0一样
Change file owner
chown -R 用户 /tmp/testfile #更改文件及其子文件的所属者属性
Modify the group to which a file belongs
chgrp -R 组名 /tmp/testfile #更改文件及其子文件的所属组属性
2. Vscode installation (app store installation)