命令行创建Vue项目（Vite）

2023年9月19日

npm create vue@latest

顺便记录下相关的命令行指令。

创建Vue项目
npm create vue@latest

新建个文件夹，在该目录下打开cmd。输入

npm create vue@latest

然后就是输入项目名和包名。这里直接用官网的示例了。不确定要不要开启这些功能的话直接一路回车过去就行。

✔ Project name: … <your-project-name>
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit testing? … No / Yes
✔ Add an End-to-End Testing Solution? … No / Cypress / Playwright
✔ Add ESLint for code quality? … No / Yes
✔ Add Prettier for code formatting? … No / Yes

Scaffolding project in ./<your-project-name>...
Done.

创建完之后会提示你输入以下代码，照着输入即可。

> cd <your-project-name>
> npm install
> npm run dev

不过这里要解释一下后面两条代码是干啥的。有人可能在想：我不是已经创建了vue项目吗，为什么还要npm？

npm install：它会根据你的package.json去获取相关的依赖包并自动下载。比如你在上面如果选择要安装Pinia，那它就会自动获取Pinia包。挺好理解的。
npm run dev：这个比较有意思。它会创建一个本地的开发服务器。即开放你本地的一个端口供网页进行测试。比如打开8080端口的话，在浏览器输入localhost:8080就会跳转到你的vue页面。方便你进行测试。（毕竟vue是响应式的）