npm 创建vue项目

### 创建新的Vue项目

为了创建一个新的 Vue 项目，需先确保 Node.js 已经正确安装并能够通过 `node -v` 和 `npm -v` 命令查看到对应的版本号[^4]。

#### 配置国内镜像源
考虑到网络因素可能影响依赖包的下载速度，在开始之前可以考虑切换至淘宝 NPM 镜像源来加速获取资源：

npm config set registry https://registry.npm.taobao.org/

#### 初始化Vue项目
使用官方推荐的方式即 Vite 或 Vue CLI 来初始化项目。对于新手来说，采用 Vue CLI 是较为常见的做法之一：

1. 安装 Vue CLI 全局工具：

   npm install -g @vue/cli

2. 使用 Vue CLI 创建新项目：

   vue create my-vue-app

这里会提示选择一些预设配置项，可以根据个人需求定制化选择特性，也可以直接按回车键接受默认设置完成快速构建过程[^1]。

3. 移动到新建项目的根目录下，并启动开发服务器：

   cd my-vue-app
   npm run serve

此时应该可以在浏览器中访问本地运行的应用程序，默认情况下地址为 http://localhost:8080/。

#### 编辑器集成与代码质量控制
建议利用 Visual Studio Code 开发环境打开刚建立起来的 Vue 应用程序，并且可以通过调整 VSCode 的 `settings.json` 文件加入如下配置实现保存时自动格式化代码的功能[^5]:

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "vue"
  ],
  "vetur.validation.template": false,
  "editor.formatOnSave": true
}