Mac 上的 Vue 安装和配置记录

我的golang之路果然有问题2026-01-10 8:49

Vue安装配置比较基础，个人基于mac

首先需要安装npm （node.js相关的）之前我装过了，搜一下一个指令就行
npm install -g @vue/cli 安装Vue的cli

bash 复制代码

vue create todo-app # 在指定的目录下
cd todo-app 
npm run serve

这是一种面对稳定的vue2的做法

bash 复制代码

# 1. 初始化项目（回答交互问题选择需要的功能）
npm init vue@latest my-vue-app
# 2. 进入项目并安装依赖
cd my-vue-app
npm install
# 3. 启动开发服务器
npm run dev

这是官方面对vue3的新建方法

我感觉采取vue2的做法更加简便，于是用第一种创建方法

同时先采取组合式 API + SFC方式，就是：单文件组件（不选html）和组合式（不选选项式）书写文件

特点是：<script setup> 以及文件为App.vue

创建对应的文件夹后，修改

目前较新的cdn：（直接官网的quickstart看就可以的）

html 复制代码

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

复制代码

brew install node
npm install -g @vue/cli  vue 的脚手架
之后 vue 命令可任意终端执行

npm install vue-router@4
Vue 主要用于构建**单页应用**（所有内容在一个页面内动态切换，无需刷新），而 `vue-router` 是实现 "**URL 与组件视图映射、路由切换过渡、嵌套路由、异步组件加载**" 等核心能力的官方工具