IDEA上安装配置VUE.js

890 阅读1分钟

安装Node.js和npm

npm类似于Linux中的apt命令,下载安装各种库。

去Node.js官网下载最新的Node.js(window64).

nodejs.org/zh-cn/

按照向导一步步安装完毕后,输入以下命令检查是否安装成功。

C:\Users\jaysh>node -v
v14.17.0

C:\Users\jaysh>npm -v
6.14.13

安装cnpm, webpack和vue-cli

首先安装npm的阿里镜像,原生npm下载依赖包过慢,镜像可以提高下载效率。 npm i -g cnpm --registry=https://registry.npm.taobao.org

其次由于vue-cli是基于webpack的,所以我们要先安装一下webpack,命令行输入:

npm install webpack -g

再安装vue-cli脚手架

cnpm install vue-cli -g

检查vue是否安装成功

vue- V

新建vue项目

vue init webpack vue-demo

此命令将在当前目录下新建vue-demo项目。

image.png

运行vue项目

cd vue-demo
npm run dev

启动后,访问localhost:8080可以看到

image.png

IDEA中配置Vue.js

File -> Settings -> Plugins:搜索vue.js,安装Vue.js,注意安装完成后会提示重新IDE

File -> Settings -> Editor -> File types, 在HTML选项中增加vue后缀。

image.png

File -> Settings -> Languages&Frameworks -> JavaScript:修改JavaScript language version为ECMAScript 6

配置完成。