一,是什么:

他就是基于webpack的一个的loader,解析和转换 .vue 文件,提取出其中的逻辑代码 script、样式代码 style、以及 HTML 模版 template,再分别把它们交给对应的 Loader 去处理,核心的作用,就是提取。

二,用途:

vue-loader会解析文件,提取出每个语言块,如果有必要会通过其他loader处理,最后将他们组装成一个commonjs模块;module.exports出一个vue.js组件对象;

1:< temlate>语言块 
(1)默认语言:html 
(2)每个.vue文件最多包含一个< template>块 
(3)内容将被提取为字符串,将编译用作VUE组件的template选项; 
2:< script> 
(1)默认语言:JS(在监测到babel-loader或者buble-loader配置时,自动支持ES2015) 
(2)每个.vue文件最多包含一个< script>块 
(3)该脚本在类CommonJS环境中执行(就像通过webpack打包的正常JS模块)。所以你可以require()其他依赖。在ES2015支持下,也可以使用import跟export语法 
(4)脚本必须导出Vue.js组件对象,也可以导出由VUE.extend()创建的扩展对象;但是普通对象是更好的选择; 
3:< style> 
(1)默认语言:css 
(2)一个.vue文件可以包含多个< style>标签 
(3)这个标签可以有 scoped 或者 module属性来帮助你讲样式封装到当前组件;具有不同封装模式的多个< style>标签可以在同一个组件中混合使用 
(4)默认情况下,可以使用style-loader提取内容,并且通过< style>标签动态假如文档的< head>中,也可以配置webpack将所有的styles提取到单个CSS文件中; 
4:自定义块 
        可以在.vue文件中添加额外的自定义块来实现项目的特殊需求;例如< docs>块;vue-loader将会使用标签名来查找对应的webpack loaders来应用到对应的模块上;webpack需要在vue-loader的选项loaders中指定;

vue-loader支持使用非默认语言,比如CSS预处理器,预编译的HTML模板语言,通过设置语言块的lang属性:

Vue Loader 还提供了很多酷炫的特性:

  • 允许为 Vue 组件的每个部分使用其它的 webpack loader,例如在 <style> 的部分使用 Sass 和在 <template> 的部分使用 Pug;
  • 允许在一个 .vue 文件中使用自定义块,并对其运用自定义的 loader 链;
  • 使用 webpack loader 将 <style> 和 <template> 中引用的资源当作模块依赖来处理;
  • 为每个组件模拟出 scoped CSS;
  • 在开发过程中使用热重载来保持状态。

简而言之,webpack 和 Vue Loader 的结合为你提供了一个现代、灵活且极其强大的前端工作流,来帮助撰写 Vue.js 应用。

v-loalder是什么?相关推荐

  1. linux怎么卸载webpack,安装webpack后,执行webpack -v命令时报错:SyntaxError: Block-sc

    安装webpack后,执行webpack -v命令时报错如下: [root@FreeServer ~]# webpack -v /usr/local/node-v4.4.7-linux-x64/lib ...

  2. 心音数据库_小V云端数据库 | 2020.9.14—2020.9.18

    桂花的芬芳 在雨后空气中弥散开来 似为湿润的情绪 赠予了一丝甜蜜 小V云端数据库 2020.9.14-2020.9.18 资讯情报关键词 健康.示范.安全 V宝体检,助力成长 2020年9月14日上午 ...

  3. 女士细线毛衣起多少针_潇洒帅气的男童V领开襟毛衣编织,带教程图解

    终于又完工一件. 用线:宝宝毛9号8团多用针:ADD2.75,3.0成衣尺寸:衣长43cm,胸围72cm,袖长42cm,肩宽32cm编织过程:1,用另线起针法起222针,织双螺纹5cm,排花,织20c ...

  4. 【实用】几个实用的webstorm、IDEA编辑器窗口快捷键设置,Alt+V垂直复制当前窗口,Alt+Shift+V将当前窗口复制到另一边的分割窗口显示,Alt+Shift+M移动当前活动窗口到另一边

    Alt+V垂直复制当前窗口 Alt+Shift+V将当前窗口复制到另一边的分割窗口显示,Alt+Shift+M移动当前活动窗口到另一边

  5. 基于持久内存的 单机上亿(128B)QPS -- 持久化 k/v 存储引擎

    文章目录 性能数据 设计背景 设计架构 Hash 索引结构 及 PMEM空间管理形态 基本API 及 实现 API 初始化流程 写流程 读流程 删除流程 PMEM Allocator设计 主要组件 空 ...

  6. KVell 单机k/v引擎:用最少的CPU 来调度Nvme的极致性能

    文章目录 前言 KVell背景 业界引擎使用Nvme的问题 CPU 会是 LSM-kv 存储的瓶颈 CPU 也会是 Btree-kv 存储的瓶颈 KVell 设计亮点 及 总体架构实现 KVell 设 ...

  7. 存储引擎 K/V 分离下的index回写问题

    前言 近期在做on nvme hash引擎相关的事情,对于非全序的数据集的存储需求,相比于我们传统的LSM或者B-tree的数据结构来说 能够减少很多维护全序上的计算/存储资源.当然我们要保证hash ...

  8. linux进程间通信:system V 信号量 生产者和消费者模型编程案例

    生产者和消费者模型: 有若干个缓冲区,生产者不断向里填数据,消费者不断从中取数据 两者不冲突的前提: 缓冲区有若干个,且是固定大小,生产者和消费者各有若干个 生产者向缓冲区中填数据前需要判断缓冲区是否 ...

  9. linux进程间通信:system V 信号量和共享内存实现进程间同步

    关于信号量和共享内存的相关描述已经在前几篇提到过: 信号量:即内核维护的一个正整数,可以使用内核提供的p/v接口进行该正整数的+/-操作,它主要用来表示系统中可用资源的个数,协调各个进程有序访问资源, ...

  10. linux进程间通信:system V 信号量

    文章目录 概念描述 通信原理 编程接口 使用流程 编程案例 概念描述 英文:semaphore 简称SEM,主要用来进行进程间同步 本质:内核维护的一个正整数,可对其进行各种+/-操作 分类:syst ...

最新文章

  1. c# 获取excel单元格公式结果_excel公式应用技巧:文字和数字混合的单元格,如何求和?...
  2. c语言怎样输出有颜色的迷宫,c语言写的迷宫问题
  3. websockets_使用Java WebSockets,JSR 356和JSON映射到POJO的
  4. 开源HTML5应用开发框架 - iio Engine
  5. Prometheus监控学习笔记之360基于Prometheus的在线服务监控实践
  6. NHibernate 3.3
  7. java中的强软弱虚_详解Java的四种引用——强软弱虚,颠覆你的认知!
  8. A*寻路算法的探寻与改良(一)
  9. 阿里巴巴java开发手册 《Java开发手册》v1.5.0 华山版.pdf
  10. 2021-2027全球与中国X射线检测系统市场现状及未来发展趋势
  11. 计算机类银行招聘考试考什么科目,计算机专业参加银行招聘考试要考哪些科目,除了行..._银行招聘考试_帮考网...
  12. python画出送花表情图编程_python画微信表情符的实例代码
  13. python3实现网络爬虫(4)--BeautifulSoup使用(3)
  14. 【哈工大SCIR】多模态情感分析简述
  15. 微信支付一直抱签名错误,但是校验通过。
  16. 毕设 JAVA.JSP网上学习答疑系统论文
  17. 年前人间尤物,年后惨不忍睹
  18. [YOLOv7/YOLOv5系列算法改进NO.17]CNN+Transformer——融合Bottleneck Transformers(更新,代码已开放分享)
  19. 计算机英语重点,计算机英语复习重点.doc
  20. otn与stn网络_全光网络:OTN与超长距离传输

热门文章

  1. 计算机教学中扩词扩句的应用,扩词练习题
  2. 关于论文查重相关问题
  3. 易人银行进账单打印软件 v1.1 免费
  4. c++英文单词填空游戏
  5. 「GoCN酷Go推荐」快速搭建私有云服务 go-btfs
  6. 西湖大学开招本科生了!每名学生配三位学术导师
  7. Mac病毒安全防护软件推荐:Symantec Endpoint Protection
  8. BLE 链路层(LL)的数据结构
  9. 关于慕课网上爱心小鱼的讲解
  10. 弹幕护体下的B站,走得越来越稳健了