当前位置：首页 > 文档资料 > Nuxt.js 中文文档 >

预处理器

优质

小牛编辑

136浏览

2023-12-01

得益于 vue-loader, 我们可以通过 lang 属性在组件中的<template>， <script> 或 <style> 上使用各种预处理器。

举个例子，我们在 pages/index.vue 组件中使用 Pug， CoffeeScript 和 Sass：

<template lang="pug">
  h1.red Hello {{ name }}!
</template>

<script lang="coffee">
export default data: ->
  { name: 'World' }
</script>

<style lang="sass">
.red
  color: red
</style>

<style lang="scss">
.red {
  color: red
}
</style>

记得安装这些预处理器对应的 npm 依赖包和 Webpack 加载器:

npm install --save-dev pug@2.0.3 pug-plain-loader coffeescript coffee-loader node-sass sass-loader

免责声明：以上内容版权归原作者所有，如有侵犯您的原创版权请告知，我们将尽快删除相关内容。感谢每一位辛勤著写的作者，感谢每一位的分享。