Configurer Sass dans Vue

Cette fois je vais vous apporter la configuration de Sass dans Vue. Quelles sont les précautions pour configurer Sass dans Vue Voici un cas pratique, jetons un oeil.

1. Créez un nouveau projet basé sur le modèle webpack

$ vue init webpack myvue

2. Dans le répertoire courant, installez les dépendances

$ cd myvue
$ npm install

3. Installez le sass package de dépendances

npm install --save-dev sass-loader
//sass-loader依赖于node-sass
npm install --save-dev node-sass

4. Ajoutez la configuration dans les règles de webpack.base.conf.js dans le dossier de construction

{
 test: /\.sass$/,
 loaders: ['style', 'css', 'scss']
}

comme indiqué ci-dessous :

5. Modifiez la balise de style dans APP.vue

<style lang="scss">

6. Exécutez ensuite le projet

$ npm run dev

7. vue, Pouvez-vous voir l'effet

8. L'arrière-plan du résultat en cours devient-il gris, ce qui signifie que vous avez configuré avec succès Sass

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser la liaison statique PHP dans le projet

Transmission dynamique des paramètres de requête dans vue- routeur Comment gérer

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!