和vscode相比，使用IDEA进行前端开发并没有那么容易，需要先进行配置 。

  1. 安装vue插件,重启idea

  1. 鼠标右键添加vue component
  • 点击 file 打开设置 settings，展开 Editor 找到 file and code templates

  • 找到 Vue single file component 并选中它，然后点击copy

  • 把 Name 改成 Vue Component，然后把代码里的 “COMPONENT_ ”删掉，最后点 ok 就好了

  • 成功结果

直接使用<script>引入

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

demo1.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<!--view层 模板-->

<div id="app">

    {{msg}}

</div>

</body>

<!--导入vue.js-->

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<script>

    var vm = new Vue({

        el:"#app",

        // Model 数据

        data:{

            msg :"hello vue"

        }

    });

</script>

</html>

vue的快速入门【IDEA版本】的更多相关文章

  1. .NET Core实战项目之CMS 第六章 入门篇-Vue的快速入门及其使用

    写在前面 上面文章我给大家介绍了Dapper这个ORM框架的简单使用,大伙会用了嘛!本来今天这篇文章是要讲Vue的快速入门的,原因是想在后面的文章中使用Vue进行这个CMS系统的后台管理界面的实现.但 ...

  2. Vue.js+vue-element搭建属于自己的后台管理模板：Vue.js快速入门（二）

    Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二) 前言 上篇文章对Vue.js有了初步理解,接下来我们把Vue.js基础语法快速的过一遍,先混个脸熟留个印象就 ...

  3. Vue.js 快速入门

    什么是Vue.js vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API.作者是尤雨溪,写下这篇文章时vue.js版本为1.0.7 准备 我推荐 ...

  4. Vue 1-- ES6 快速入门、vue的基本语法、vue应用示例，vue基础语法

    一.ES6快速入门 let和const let ES6新增了let命令,用于声明变量.其用法类似var,但是声明的变量只在let命令所在的代码块内有效. { let x = 10; var y = 2 ...

  5. Vue.js快速入门

    Vue.js介绍 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们 ...

  6. Vue.js——快速入门

    Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们能够快速地上手并使 ...

  7. Vue的快速入门

    1 环境准备 1 下载安装Node 地址https://nodejs.org/en/download/ 完成后通过cmd打开控制台输入node -v 可以看到版本信息 2 通过该node自带的npm ...

  8. Vue.js—快速入门

    Vue.js是什么 Vue.js 是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目 ...

  9. Vue.js—快速入门及实现用户信息的增删

    Vue.js是什么 Vue.js 是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目 ...

随机推荐

  1. centos命令上传

    首先安装 lrzsz # yum -y install lrzsz 运行 rz 命令: 在弹出的窗口选择需要上传的文件,文件会被上传至对应的目录下 运行 sz file.name 在弹出的窗口选择保存 ...

  2. Mysql在windows环境如何修改密码？

    1.关闭正在运行的MySQL服务. 2. 打开DOS窗口,转到mysql\bin目录. 3. 输入mysqld --skip-grant-tables 回车.--skip-grant-tables 的 ...

  3. Java并发编程之并发关键字

    volatile 保证可见性 一个线程修改volatile变量的值时,该变量的新值会立即刷新到主内存中,这个新值对其他线程来说是立即可见的 一个线程读取volatile变量的值时,该变量在本地内存中缓 ...

  4. SyntaxError ：invalid syntax Python常见错误

    1.忘记在 if , elif , else , for , while , class ,def 声明末尾添加 ":" 2.使用 = 而不是 ==,= 是赋值操作符而 == 是等 ...

  5. [Fundamental of Power Electronics]-PART I-3.稳态等效电路建模，损耗和效率-3.5/3.6 示例：Boost变换器中包含的半导体传导损耗/要点小结

    3.5 示例:Boost变换器中包含的半导体传导损耗 作为最后一个示例,让我们考虑对图3.22所示的Boost变换器中的半导体传导损耗进行建模.功率损耗的另一个主要来源是半导体器件的正向电压降引起的传 ...

  6. Python基础之:struct和格式化字符

    目录 简介 struct中的方法 格式字符串 字节顺序,大小和对齐方式 格式字符 格式数字 格式字符 格式字符串 填充的影响 复杂应用 简介 文件的存储内容有两种方式,一种是二进制,一种是文本的形式. ...

  7. kestrel Server的源码分析

    今天这一篇博客讲的是.net core 自带的kestrel server,当你开发微服务k8s部署在linux环境下,一般默认开启这个高性能服务,如果大家之前看过我的owin katana的博客,会 ...

  8. Prometheus【node_exporter】+grafana监控云主机

    下面说一下这个开源软件的安装实践过程,目标如下: 在监控服务器上安装prometheus 在被监控环境上安装exporter 安装grafana 在监控服务器上安装prometheus 开始安装pro ...

  9. 一款轻量级的声明式http调用工具！

    前沿 项目中我们经常会使用HTTP工具向外部的REST接口发送请求,大家一般使用Okhttp,或者java的HttpClient发起,今天给大家介绍一款轻量级声明式的Http库(FeignClient ...

  10. Pandas——Series and DataFrane

    数据科学--pandas库 pandas中有两个主要的数据结构,一个是Series,另一个是DataFrame.通过这两类数据,可以下载数据.可视化数据.和分析数据. Pandas安装:pip ins ...