序文私は less/sass を書くことに慣れていますが、小さなプログラムを開発するときには、まだ css が足りず、慣れていません。 私がオンラインで検索したチュートリアルは、gulp または vscode 用の Easy-less プラグインに関するものでした。 伝統的な方法これら 2 つの方法の長所と短所を比較してみましょう。 ゴクリ 前者はgulpの基本的な理解が必要ですが、現在人気のwebpackではgulpを使用する人が減っており、一定の学習コストがかかりますが、幸いなことにカスタマイズ性が高く、自由にtakeを追加できます。 VScodd による Esay-less プラグイン 何も言わずとも、かなり良いです。vscodeにeasy-lessプラグインをインストールし、.jsonを設定するだけで、lessを楽しく使用できます。保存すると、同じディレクトリに.wxssファイルを生成できます。欠点は、vscodeで使用する必要があることです。つまり、開発中に2つのエディターを開く必要があります。1つはvscodeでlessを書くため、もう1つはWeChat開発者ツールを使用してプレビューするためです...うーん、想像できないほど美しい写真です 新たなアプローチたまたまインターネットで「ミニプログラムで less を使いたいですか? (VScode 版)」のスクリーンショットを見ました。 WeChat 開発ツールで直接使用できる Easy-less は、vscode で使用されているものと同じ機能を備えています。あまりに驚いたので、公式ドキュメントを確認したところ、WeChat 開発ツールはバージョン 1.03.2004271 から拡張ツールのサポートを開始していたことがわかりました。 そして、vscodeの拡張機能を使用するだけで、非常に便利です 一連の操作を経て、それが可能であることが証明されました。 ステップ1. VscodeにEasy-lessをインストールする 2. 拡張フォルダ 解凍されたフォルダは、~/.vscode/extensions (macOS システム) または C:\Users\username.vscode\extensions (Microsoft Windows システム) にあります。 mrcrowl.easy-less-1.6.3ファイルをWeChat開発者ツールにコピーします。 3. 拡張機能フォルダを貼り付ける WeChat開発者ツールを開き、トップバーから設定 > 拡張機能設定 > 拡張機能 > カスタム拡張機能を選択します。 「拡張フォルダを開く」をクリックするとフォルダが開くので、ここに貼り付けます。 4. output.wxssを設定する 残っているのは最後のステップだけです。Easy-less はデフォルトで CSS を出力しますが、アプレットは .wxss ファイルを使用する必要があるため、出力ファイルのサフィックスを設定するだけです。 5. WeChat開発者ツールを再起動する 設定が成功したら、アプレットを閉じて再度開き、pages ディレクトリでページを見つけて新しい index.less を作成し、CSS を記述して保存し、index.wxss に変更があるかどうかを確認します... 最終結果参照:
要約するWeChat ミニプログラムで Less を使用する方法 (最良の方法) に関するこの記事はこれで終わりです。WeChat ミニプログラムで Less を使用する方法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後も 123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: Linux ディスクのマウント、パーティション分割、容量拡張操作を実装する方法
今日は、すべてのブラウザ (主に IE 9 以上と Chrome) と互換性のある自分のホームページ...
目次1. インデックスの基礎知識1.1 インデックスの利点1.2 インデックスの有用性1.3 インデ...
目次序文文章1. グローバル登録2. 部分登録3. フック機能とパラメータ設定4. 柔軟な使い方(1...
序文クラスメートが MLSQL Stack のストリーミング サポートを調査しています。そこで、フロ...
MySQL の内部関数instrを使用すると、従来の like クエリ メソッドを置き換えることがで...
display:flex、justify-content: space-betweend を設定する...
弊社のネットワーク管理センターは管理センター兼サーバーとして機能します!各管理対象デバイスは、TCP...
Nginx の最適化 - バージョン番号と Web ページのキャッシュ時間を非表示にするバージョン番...
Docker 公式ドキュメント: https://docs.docker.com/ Docker は...
db2 データベースをホストマシンに直接インストールするのは面倒で、ユーザーや権限を巻き込むのも不便...
MySQL では、1 つの列に複数のインデックスを作成できます。意図的であるかどうかにかかわらず、M...
要件は次のとおりですテーブル構造、フィールドコメント情報、テーブル名などをエクスポートします。これは...
序文現在の JavaScript には列挙の概念がありません。一部のシナリオでは、列挙を使用するとデ...
1. データベースクエリの速度に影響を与えるものは何ですか? 1.1 データベースクエリ速度に影響を...
FlashFXPのダウンロードアドレスは、https://www.jb51.net/softs/95...