Heim > Web-Frontend > js-Tutorial > So verwenden Sie die Sass-Konfiguration im Vue-Projekt

So verwenden Sie die Sass-Konfiguration im Vue-Projekt

php中世界最好的语言
Freigeben: 2018-04-11 14:02:46
Original
2601 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie die Sass-Konfiguration in Vue-Projekten verwenden. Was sind die Vorsichtsmaßnahmen für die Verwendung der Sass-Konfiguration in Vue-Projekten?

1. Erstellen Sie ein neues Projekt basierend auf der Webpack-Vorlage

$ vue init webpack myvue
Nach dem Login kopieren

2. Im aktuellen Verzeichnis installieren Sie die Abhängigkeiten

$ cd myvue
$ npm install
Nach dem Login kopieren

3. Installieren Sie das Sass-Abhängigkeitspaket

npm install --save-dev sass-loader
//sass-loader依赖于node-sass
npm install --save-dev node-sass
Nach dem Login kopieren

4. Fügen Sie die Konfiguration

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

in den Regeln von webpack.base.conf.js im Build-Ordner hinzu Wie unten gezeigt:

So verwenden Sie die Sass-Konfiguration im Vue-Projekt

5. Ändern Sie das Style-Tag

<style></style>
Nach dem Login kopieren

in APP.vue 6. Führen Sie dann das Projekt aus

$ npm run dev
Nach dem Login kopieren

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erläuterung der Schritte für Vue zur Verarbeitung der Storejs-Datenerfassung

Welche Methoden gibt es, um .vimrc neu zu laden, ohne Vim neu zu starten?

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Sass-Konfiguration im Vue-Projekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage