Vue Loader

# 简介

版本说明

这是 Vue Loader v15 及以上版本的文档。如果您从 v14 或更早版本升级，请查看 迁移指南。如果您使用的是旧版本，旧文档在 这里.

# 什么是 Vue Loader？

vue-loader 是一个用于 webpack 的加载器，它允许您以一种称为 单文件组件 (SFC) 的格式编写 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 加载器，例如，为 <style> 使用 Sass，为 <template> 使用 Pug；
  • 允许在 .vue 文件中使用自定义块，这些块可以应用自定义加载器链；
  • 将 <style> 和 <template> 中引用的静态资产视为模块依赖项，并使用 webpack 加载器处理它们；
  • 为每个组件模拟作用域 CSS；
  • 在开发期间进行状态保留的热重载。

简而言之，webpack 和 vue-loader 的结合为您提供了用于编写 Vue.js 应用程序的现代、灵活且功能强大的前端工作流程。

入门 →