1. 安装vue的包： cnpm i vue -S
2. 由于 在 webpack 中，推荐使用 .vue 这个组件模板文件定义组件，所以，需要安装 能解析这种文件的 loader cnpm i vue-loader vue-template-complier -D
3. 在 main.js 中，导入 vue 模块 import Vue from 'vue'
4. 定义一个 .vue 结尾的组件(例如，login.vue )，其中，组件有三部分组成： template、 script 、style
5. 使用 import login from './login.vue' 导入这个组件
6. 创建 vm 的实例 var vm = new Vue({ el: '#app', render: c => c(login) })
7. 在页面中创建一个 id 为 app 的 div 元素，作为我们 vm 实例要控制的区域；

webpack 中如何使用 vue的更多相关文章

  1. webpack中如何使用vue

    1.安装 vue包:npm i vue -S 2.由于在webpack中,推荐使用.vue这个组件模版文件来定义组件,不然会出现vue.js移动和一些高级语法的不支持,因此需要安装能解析这种文件的lo ...

  2. 总结梳理:webpack中如何使用vue

    1. 安装vue的包 cnpm i vue -S  2. 由于在webpack中,推荐使用 .vue这个组件模板文件定义的组件,所以,需要安装,   能解析这个文件的loader: cnpm i vu ...

  3. 在Vue的webpack中结合runder函数

    在Vue的webpack中结合runder函数 1.引入: <h1>下面是vue的内容:</h1> <div id="app"> <log ...

  4. 在webpack中配置vue.js

    在webpack中配置vue.js 这里有两种在webpack中配置vue.js的方法,如下: 1.在main.js中引入vue的包: index.html: <!DOCTYPE html> ...

  5. vue2.0基础知识，及webpack中vue的使用

    ## 基础指令 ## [v-cloak]{         Display:none;     }     <p v-cloak>xx{{msg}}xx</p> //解决闪烁问 ...

  6. webpack 中导入 vue 和普通网页使用 vue 的区别（四）

    一:在普通网页中使用 vue 使用 script 标签,引入 vue 包 在 ndex 页面中,创建一个 id 为 App 的 div 容器 通过 new Vue 得到一个 vue 实例 二:在 we ...

  7. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em，rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  8. 使用pug(jade),以及在vue+webpack中使用pug(jade)

    一:在HTML中使用pug 在css中有预处理器less和scss来使我们的样式表更加的简介,那么在HTML中有没有这样的格式呢,答案是有的,那就是pug(前身是jade),效果如下: 转译以后 好, ...

  9. webpack中使用vue

    1.安装vue cnpm i install -S 2.由于在 webpack 中,推荐使用 .vue 的文件模板文件定义组件 , 所以 ,需要安装 能解析这种文件的 loader cnpm i vu ...

随机推荐

  1. YOLO_v1

    目标检测算法可以分为两类: 一类是基于region proposal的R-CNN系列算法(R-CNN,Fast R-CNN, Faster R-CNN),它们是two-stage的.要先使用启发式方法 ...

  2. iframe嵌套页面 跨域

    父级调用iframe方法: document.getElementById("iframe").contentWindow.func(data1,data2...) 子级 ifra ...

  3. 记一次全局分区索引update调优

    原始SQL: CREATE OR REPLACE PROCEDURE sp_upd_suppressed_emails(  A_LIMIT_BULK IN PLS_INTEGER DEFAULT 20 ...

  4. Spring Security 报There is no PasswordEncoder mapped for the id "null"

    查了下发现是spring security 版本在5.0后就要加个PasswordEncoder了 解决办法 在securityConfig类下加入NoOpPasswordEncoder,不过官方已经 ...

  5. iptables添加、删除端口

    简洁才是王道, 下面是添加一个udp端口,端口号8566,即接收到8566端口的所有udp包 /sbin/iptables -I INPUT -p udp --dport -j ACCEPT 要删除这 ...

  6. leetcode-easy-array-122 best time to buy and sell stocks II

    mycode  69.45% class Solution(object): def maxProfit(self, prices): """ :type prices: ...

  7. http-server 建立 HTTPS 服务

    1. 创建证书 进入要建立 HTTPS 服务的目录 openssl genrsa -out key.pem 1024 openssl req -new -key key.pem -out csr.pe ...

  8. hdu 4758 (AC自动机)

    除了走到哪里,还要加状态表示当前节点和已经匹配的串 #include<iostream> #include<cstdio> #include<string> #in ...

  9. java网络通信：伪异步I/O编程(PIO)

    缺点:避免了线程资源耗尽的问题,但是根本上来说,serversocket的accept方法和inputstream的输入流方法都是阻塞型方法. 服务端:加了一个线程池,实现线程复用.客户端不变 pub ...

  10. Openstack_通用模块_Oslo_vmware 创建 vSS PortGroup

    目录 目录 vSS vSSPG vSphere SDK 中相关的网络对象 创建 vSS PortGroup vSS & vSSPG vSS(Standard vSwitch 标准交换机) 为在 ...