ユニアプリサス

sass依存関係がインストールされておらず、scssを使用すると次のエラーが報告されます。

dev：mp-weixin： `cross-env NODE_ENV = development UNI_PLATFORM = mp-weixin vue-cli-service uni-build --watch

Sassの紹介

Sass（英語のフルネーム：Syntactically Awesome Stylesheets）は、Hampton Catlinによって設計され、NatalieWeizenbaumによって開発されたカスケードスタイルシート言語です。

• SassはCSSプリプロセッサです。
• Sassは、CSSの重複を減らし、開発時間を節約するのに役立つCSS拡張言語です。
• SassはCSSのすべてのバージョンと完全に互換性があります。
• SassはCSS3を拡張し、ルール、変数、ミックスイン、セレクター、継承、組み込み関数などの機能を追加します。
• Sassは、整理と保守が簡単な、適切にフォーマットされたCSSコードを生成します。
• Sassファイルのサフィックスは.scssです。

Sassの使用方法（ vueファイルの下のスタイルタグにlang = "scss"属性を追加します）

<style lang="scss">

</style>

Sassのインストール

方法1（放棄）

1. npm install -g cnpm --registry = https：//registry.npm.taobao.org
2. cnpm install sass-loader node-sass（最新バージョンがインストールされている場合、エラーが報告されます）

方法2（成功）

1.package.jsonを更新します

...

"node-sass": "^4.0.0",
"sass-loader": "^7.3.1",

...

2.npmインストール

Sassの基本的な使用法の説明

<style lang="scss">
.container {
	width: 100%;
	padding: $uni-spacing-row-lg;
	&_text {
		font-size: $uni-font-size-sm;
		text-indent: 2em;
		color: $uni-text-color;
		padding-bottom: $uni-spacing-col-sm;
	}
}
</style>

• 単位サイズ、色など、scssファイル内の対応する変数値を直接使用できます。単位サイズは演算子を使用して基本的な操作を実行できます。
• scssを使用した後、同じ親要素の下の要素を、階層ネストの親要素セレクターの直下で使用できます。
• 「＆」記号を使用してセレクターを接続できます。「＆」は、次のように解析される親セレクタープレースホルダーと同等です   。.container_text
• @mixinを使用してscssでメソッドを定義し、@ includeを使用して呼び出します（詳細については公式Webサイトを参照）。1つのページでscs​​sファイルを参照します。@ import './ style / mixin.scss';