Webstorm 搭建一个Vue项目

前言

本文旨在帮助大家在Webstorm上搭建一个简单的Vue项目，作者也是萌新一枚，大家一起学习啦！

一、环境准备

1、安装node.js

下载地址：Node.js (nodejs.org)

选择左边的选项（Recommended For Most Users）下载

 2、检查是否安装成功

按win+r打开运行对话框，输入cmd点击确定，打开命令行

 在命令行中分别输入 node -v 和 npm -v 验证是否安装成功，如果显示了版本号则证明安装成功了！

 3、全局安装脚手架vue-cli

在命令行输入：

npm install vue-cli -g（vue2版本）

npm install -g @vue/cli（vue3版本）

下载结束后，输入vue -V（大写的V），检查是否安装成功：

 二、在Webstorm上搭建Vue项目（以vue2为例）

1、选择新建项目，选择Vue.js项目；

2、修改自己的项目名，位置的最后是你项目的名称，在这里，我的项目名称就是test

3、选择刚刚下载好的node.js和vue-cli的位置

4、点击创建

 5、因为作者没有勾选使用默认项目设置，系统会先让你选择vue项目的版本，这里我们选择vue2版本的默认设置

这里需要等待一段时间，因为Webstorm根据npm包管理器会帮你下载所必须的依赖

 6、下载完成后，点击右上角运行按钮，让自己的第一个vue项目跑起来吧！运行成功会显示对应的项目本地网页链接，点击链接会显示vue的欢迎页面。