VUE-CLI単一ファイルコンポーネントのための、より少ない、草のような、cssスタイルを導入するさまざまな方法について話す

1 Star2 Stars3 Stars4 Stars5 Stars (まだ評価されていません)
Loading...

sassとlassの設定はvue-cliで設定されています。 2つのモジュールを直接ダウンロードする必要がある場合、webpackは適切なローダーを自動的に使用してlang属性に従って処理します。

sassを使用する必要がある場合は、次のようにインストールします。


npm install node-sass -save-dev 
npm install sass-loader -save-dev 

lessを使用する必要がある場合は、以下をインストールします。


npm install less -save-dev 
npm install less-loader -save-dev 

サスのインラインライティング:


<style lang="sass" scoped> 
//sass样式 
</style> 

少ないインライン書き込み:


<style lang="less" scoped> 
//less样式 
</style> 

cssのインライン書き込み:


<style lang="css" scoped> 
//css样式 
</style> 

浅瀬のリファレンスは以下のように書かれています


<style lang="sass" src="./index.sass"></style> 

少ない引用:


<style lang="less" src="./index.less"></style> 

CSSの参照表記:


<style lang="css"> 
@import './index.css' 
</style> 
或者 
<style lang="css" src="./index.css"></style> 

上記のwebpackプラグインの私の自身のビット抽出 – テキスト – webpack – プラグインの単一ファイルコンポーネントのCSSコンパイラの抽出、私を修正してください、ありがとう!

これは、Vase-Cliの単一ファイルコンポーネントをよりシンプルでシンプルなCSSスタイルに導入するための、別の方法です。誰とでも共有できる小さなシリーズです。参考にしたいと思っています。


1 Star2 Stars3 Stars4 Stars5 Stars (まだ評価されていません)
Loading...
      この投稿は審査処理中  | 元のサイトへ