Intellij Vue开发配置

File -> Settings -> Editor -> File Types -> HTML

点Registered Patterns下的+,添加 *.vue

在这里插入图片描述

3.设置JS


File -> Settings -> Language & Frameworks -> JavaScript

选择 ECMAScript 6 和 Prefer Strict mode

在这里插入图片描述

4.构建及运行vue-cli项目


在命令行工具cmd,或者Intellij IDEA的Terminal中进入想要构建项目的目录,输入vue init webpack project-name,回车webpack默认版本为2.0,若要指定1.0,需在webpack后加上#1.0,即vue init webpack#1.0 project-name

接下来会出现几个提示,分别是输入项目名称、描述、作者等,按实际情况选择即可。

  • Project name ---- 项目名称,init命令时也填了个project-name,如果无需更改,直接回车即可;

  • Project description ---- 项目描述,按需填写。无需填写可以直接回车;

  • Author ---- 作者

  • Vue build ---- 构建模式,一般默认第一个;

  • Install vue-router ---- 是否安装vue-router。选Y。后边构建项目会用到。

  • Use ESLint to lint yout code ---- 格式校验,按需;

  • Set up unit tests ---- 测试相关,按需;

  • Setup e2e tests with Nightwatch ---- 测试相关,按需;

  • Should we run ‘npm install’ for you after the project has been created ---- 按需,这里我选Yes, use NPM。如果选No,后续自己在目标目录下执行npm install即可。

这样构建出来的项目,可以直接运行。进入项目所在目录,执行npm run dev,执行完看到以下提示:Your application is running here: http://localhost:8080。在浏览器打开http://localhost:8080,看到这个页面,接下来就可以开始开发了。

在这里插入图片描述

5.Intellij IDEA新建.vue格式文件


在开发的时候,会发现新建文件时并没有.vue格式文件的选择,这时我们需要做一些设置。File -> Settings -> Editor -> File and Code Templates -> +模板内容可以按需。可以填也可以不填

{{msg}}

设置完成后,就能新建.vue格式的文件了。:) ![在这里插入图片描述]( ) ## 6.idea运行vue项目 Run - Edit Configurations…:点击加号,选择npm,Name为Run,package.json选择你工程中的package.json,Command为run,Scripts为dev,然后就可以直接在idea中运行了 ![在这里插入图片描述]( )
继续点击加号,选择npm,Name为Build,package.json选择你工程中的package.json,Command为run,Scripts为build,然后就可以直接在idea中打包了。
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值