1. scss プラグインをダウンロードします
。HX メニューの [ツール] -> [プラグインのインストール] で「scss/sass コンパイル」プラグインを見つけてインストールします。有効にならない場合は、HX を再起動してください。ダウンロード リンク
scss / Sass コンパイル - DCloud プラグイン マーケット
2. uView ファイルをダウンロードし、
uni-app プラグイン マーケットの右上隅で
HBuilder の使用を選択し、プロジェクトのルート ディレクトリに移動します。
ダウンロードリンクuView2.0がリリースされ、剣は抜かれ、世界は統一される - DCloudプラグインマーケット
ファイルのルートディレクトリに置きます
3. uView メイン JS ライブラリの導入
プロジェクトのルート ディレクトリの main.js に、uView の JS ライブラリを導入して使用します (この 2 行は import Vue の後に配置する必要があります)。
「uview-ui」から uView をインポートします。
Vue.use(uView);
4. uView のグローバル SCSS テーマ ファイルを導入する
/* uni.scss */
@import 'uview-ui/theme.scss';
5. uView 基本スタイルを導入します。
注: App.vue の最初の行に導入します。必ず lang="scss" 属性を style タグに追加してください。
<style lang="scss">
/* 先頭行に記述し、スタイルタグに lang="scss" 属性を追加する必要があることに注意してください*/ @import
"uview-ui/index.scss";
</スタイル>
6. easycom コンポーネント モードの構成
この構成は、プロジェクトのルート ディレクトリの pages.json で実行する必要があります。
ヒント: デバッグのパフォーマンス上の理由から、uni-app による easycom ルールの変更はリアルタイムでは有効になりません。設定後、uView 機能を通常どおり使用するには、HX を再起動するか、プロジェクトを再コンパイルする必要があります。
Pages.json に easycom フィールドが 1 つだけあることを確認してください。そうでない場合は、複数のインポート ルールを自分でマージしてください。
// Pages.json
{ "easycom": { "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue" }, // これはすでに利用可能なコンテンツです "ページ": [ // ... ] }