vue.loader 是什么? 下面本篇文章给大家介绍一下 vue.loader. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
简单的说, 他就是基于 webpack 的一个的 loader, 解析和转换 .vue 文件, 提取出其中的逻辑代码 script, 样式代码 style, 以及 html 模版 template, 再分别把它们交给对应的 Loader 去处理, 核心的作用, 就是提取, 划重点.
至于什么是 webpack 的 loader, 其实就是用来打包, 转译 JS 或者 CSS 文件, 简单的说就是把你写的代码转换成浏览器能识别的, 还有一些打包, 压缩的功能等.
这是一个. vue 单文件的 demo
vue 文件式例
- <template>
- <div class="example">{{ msg }}</div>
- </template>
- <script>
- export default {
- data () {
- return {
- msg: 'Hello world!'
- }
- }
- }
- </script>
- <style>
- .example {
- color: red;
- }
- </style>
vue-loader 的作用 (引用自官网)
允许为 Vue 组件的每个部分使用其它的 webpack loader, 例如在 <style> 的部分使用 Sass 和在 <template> 的部分使用 Pug;
允许在一个 .vue 文件中使用自定义块, 并对其运用自定义的 loader 链;
使用 webpack loader 将 <style> 和 <template> 中引用的资源当作模块依赖来处理;
为每个组件模拟出 scoped CSS;
在开发过程中使用热重载来保持状态.
更多 Web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/vue-js/16967.html