mac 基于webstorm新建vue3项目

吴舒之

已于 2024-03-02 19:05:03 修改

阅读量1k

点赞数 5

CC 4.0 BY-SA版权

文章标签： macos webstorm vue

于 2024-03-02 18:55:33 首次发布

本文链接：https://blog.csdn.net/qq_43806379/article/details/136419220

该博客主要介绍在macOS系统下，使用WebStorm新建Vue3项目的步骤。首先要安装Node.js并查看版本号，接着配置Vue3环境，包括安装淘宝镜像、Vue脚手架等，最后使用WebStorm新建项目，选择版本、启动方式，运行成功后即可打开项目。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、安装Node.js

1. 分别输入以下代码查看node版本号和npm版本号，如果出现版本号，请跳转文章第二步。

//node版本号
node --version

//npm版本号
npm --version

2. 下载地址

Node.js

二、配置vue3环境

2.安装淘宝镜像

sudo npm install -g cnpm --registry=https://registry.npm.taobao.org --verbose

3. 输入版本号查看是否成功

cnpm --version

4. 安装vue脚手架

sudo npm install -g @vue/cli

如果安装失败，分别输入以下代码

// 1、如果之前安装了vue2版本，先卸载已安装的脚手架

sudo npm uninstall vue-cli -g

// 2、修改目录的可访问权限，因为mac高版本会对目录做保护，读取的时候会有权限限制

sudo chown -R $(whoami) /usr/local/*
sudo npm i docsify-cli -g

5. 输入版本号查看是否成功

vue -version

三、使用webstorm新建vue项目

1. 新建项目，选择空项目，选择你存放代码的文件夹

2. 终端输入命令新建项目

3. 选择vue3版本（上下键选择，回车键确定）

4. 选择npm 或者yarn启动项目，我这里使用的是yarn

// 1、先进入创建的项目
cd 项目名称

// 2、启动项目
yarn serve

5. 运行成功点击链接打开项目

6. 运行成功