Comment utiliser des préprocesseurs?

Grâce à Vue Loader, vous pouvez utiliser n'importe quel préprocesseur pour vos <template>, <script> ou <style> : il suffit d'utiliser l'attribut lang.

Exemple d'une pages/index.vue utilisant Pug, CoffeeScript et Sass :

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

<script lang="coffee">
module.exports = data: ->
  { name: 'World' }
</script>

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

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

Pour être en mesure d'utiliser ces préprocesseurs, nous devons installer leurs loaders webpack :

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

Vous avez vu une erreur ou vous souhaitez contribuer à la documentation ? Éditez cette page sur GitHub !