IntelliJ IDEA 编辑器配置vue高亮显示
1.查找IntelliJ IDEA是否已经安装vue.js
注:之前有写过关于使用cmd命令搭建vue项目的全部过程,详情在此
打开IDEA编辑器,快捷键Ctrl+Alt+S打开Settings(设置)------>Plugins------>搜索vue.js(图中已经安装,没有安装的点击Install JetBrains plugins...进行安装即可),安装成功后重启IDEA。
2.IDEA安装好vue.js后,接着Ctrl+Alt+S打开设置------>Editor------>File Types------>HTML,点击右侧+号,添加*.vue,最后点击Apply。
3.设置JS
继续Ctrl+Alt+S(Settings)------>Language & Frameworks------>JavaScript选择ECMAScript 6和Prefer Strict mode。
4.用vue-cli构建和运行项目
打开命令行工具cmd(Window+R),或者在IDEA中的Terminal里面进入想要构建项目的目录,输入vue init webpack mypro(mypro是自己想要构建的项目名称),回车后如下图:
5.进入构建之后的项目文件夹:cd mypro,输入npm install ,项目文件夹中会出现node_modules文件夹。
6.最后执行npm run dev(运行项目之前记得把config文件夹中的index.js中的autoOpenBrowser设置为true,这样的话npm run dev浏览器会自动打开项目)。运行结果如下图:
7.在IDEA中新建.vue格式的文件
开发的时候IDEA编辑器中是没有.vue格式文件的,所以需要在编辑器中设置。
接着Ctrl+Alt+S(Settings)------>Editor------>File and Code Templates
设置完成后就可以直接在项目中新建.vue格式文件了~~~
新建的home.vue结果:
IntelliJ IDEA 编辑器配置vue高亮显示相关推荐
- IntelliJ IDEA详细配置
2019独角兽企业重金招聘Python工程师标准>>> IntelliJ IDEA详细配置 关闭Intellij IDEA自动更新 在File->Settings->Ap ...
- IntelliJ IDEA的配置优化
IntelliJ IDEA的配置优化 我们安装完IntelliJ IDEA之后,在弹出的欢迎页面下方点击Configure,选择Setting,打开以下界面,我们在这个界面中进行配置. Appeara ...
- Intellij IDEA优化配置(1)------Darcula主题的选择以及字体和颜色配置(基于Intellij IDEA 2019.1)
Darcula主题的选择以及字体和颜色配置 Intellij IDEA优化配置 一. 主题选择 二.主题导入 三.设置背景图片以及导入插件 四.字体和颜色的选择 五.总结 六. 资源文件 Intell ...
- Intellij ideaIU 常用配置
Intellij ideaIU 常用配置 下载 Intellij ideaIU 访问 Intellij 官网 ideaIU 的下载页面 http://www.jetbrains.com/idea/do ...
- vim终极编辑器配置
VIM 终极编辑器配置 1. 配置 vimrc 2. 安装 Vundle 管理插件 3. 安装 vimrc 中的插件 1. 配置 vimrc 复制到 ~/.vimrc , source ~/.vimr ...
- vscode中如何修改vetur配置_vscode 配置vue+vetur+eslint+prettier自动格式化功能
该配置用于vue开发,最终效果是保存时自动根据eslint对js.html和css代码进行格式化. vscode Vetur插件 Vetur插件用于识别vue文件,原本vetur自带格式化功能,但是和 ...
- webpack配置vue组件加载器
前言 App.vue单文件组件代码 <template><div><h1>App根组件</h1></div> </template&g ...
- vue 一个页面多个router-view如何配置子路由_前端开发:如何安装配置Vue路由?
大家好,我来了!本期为大家带来的Web前端学习知识是"前端开发:如何安装配置Vue路由?",喜欢Web前端的小伙伴,一起看看吧! Vue Router 是 Vue.js 官方的路由 ...
- Vue 单文件组件||Vue 单文件组件的基本用法||webpack 中配置 vue 组件的加载器|| 在 webpack 项目中使用 vue
Vue 单文件组件 传统组件的问题和解决方案 1. 问题 1. 全局定义的组件必须保证组件的名称不重复 2. 字符串模板缺乏语法高亮,在 HTML 有多行的时候,需要用到丑陋的 \ 3. 不支持 CS ...
最新文章
- 原创不易!做网络推广怎么才能更好地保护网站的原创文章?
- python交互式终端是怎么实现的_python中的脚本和交互式终端客户端
- Ubuntu16.04在线安装MongoDB详细教程
- Ueditor1.4.3上传视频IE下无法播放的问题
- Hadoop2.4.1入门实例:MaxTemperature
- WebStrom Sass 编译配置 windows
- NDoc修改版,支持中文注释及中文界面。
- linux 内存规划,生产场景怎么对linux系统进行合理规划分区?
- 02-CSS基础与进阶-day4__2018-08-31-21-33-03
- SQL Server审核功能–发现和体系结构
- weui实现微信网页模板(主页,购物车,分类,后台等等)
- n-3000系列串口服务器,串口转网络,网络转串口
- linux用sed命令修改IP地址,通过sed命令获取IP地址
- 烧脑又过瘾!这个被严重低估的学习方法,看完瑟瑟发抖!
- 上海联通宽带使用公网IP进行端口映射及国际出口测试等记录
- python爬取头条付费专栏视频_用Python编写爬取头条视频的代码
- 母牛生小牛问题-字节跳动笔试题
- 使用 GNU gettext 实现国际化
- java初级程序员考试_Java初级程序员必须要知道的10个基础面试题
- 【Windows 问题系列第 2 篇】如何让显示的窗口在桌面的最上面,而不被其它窗口遮挡?