VUEグローバルに使用するCSSスタイル

スタイラスを使用します。

　　1.のsrcディレクトリ内の資産varibles.stylファイルをファイルのスタイルでファイルを作成します。

　　2.書き込みコードvaribles.stylファイル

$はbgColor =＃00bcd4

　　3.グローバルスタイルスタイルVUEアセンブリに導入

@import '../../../assets/styles/varibles.styl'

　　4.グローバルスタイルの使用

.header { 
      背景：$はbgColor    
 }

 ネイティブCSSを使用します。

　　1. srcディレクトリ内のスタイルファイル資産varibles.cssファイル内のファイルを作成します。

　　2.書き込みコードvaribles.cssファイル

/ * グローバルスタイル* / 
：ルート { 
    --bgColor：＃00bcd4 ; 
    --textColor：＃333 ; 
    --headerHeight：.86rem ; 
}

　　3.グローバルスタイルスタイルVUEアセンブリに導入

/ * グローバルスタイル一元管理へのグローバルスタイルのCSSファイルの導入は、JSの差は〜を追加するために、@の前に導入されたコードの保守性とCSSファイルを向上させるために、指定したディレクトリに定義されてvue.config.js _s * / 
    〜@import」を_s / varibles.css';

　　4.グローバルスタイルの使用

.header { 
    ディスプレイ：フレックス。
    行の高さ：VAR（ - headerHeight） 。
    背景：VAR（ -はbgColor） 。
    色：#FFF ; 
}