序文私は 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 ディスクのマウント、パーティション分割、容量拡張操作を実装する方法
この記事の例では、じゃんけんゲームを実装するためのJSの具体的なコードを参考までに共有しています。具...
シンプルなSpring Boot Webプロジェクトを作成するアイデア ツールを使用して、Sprin...
バックエンド プログラマーは、さまざまな場所で Linux を扱います。Linux ログの読み方がわ...
序文Linux カーネルでは、netfilter は、パケット フィルタリング、ネットワーク アドレ...
最近、Yahoo の 34 の黄金律を読み、ウェブサイトのパフォーマンスを最適化する方法を学びました...
コードをコピーコードは次のとおりです。 <thead> <!– 最初の 2 行をヘ...
前提条件Compose は、Docker コンテナをオーケストレーションするためのツールです。Doc...
6つの効果実装コードhtml <h1>CSS 境界遷移</h1> <セ...
目次1. 配列を結合する2. 配列をマージする(最初に) 3. 配列の複製4. 構造化分解割り当て5...
1 ユーザーを作成し、ユーザーのルートパスとパスワードを指定します useradd -d /home...
以下のように表示されます。 //managefee_managefee テーブルの年と月を照会し、c...
DOCTYPE 宣言 作成するすべてのページの先頭に、ドキュメント宣言が必要です。はい、そうでしょう...
少し前にTikTokで揺れる連打が流行っていたので真似してみることにしました。さっそく効果をみてみま...
1. 戻るボタンhistory.back() を使用してブラウザの「戻る」ボタンを作成します。 &l...
現在、新しいアプリプロジェクトを開発中です。私にとっても初めてのアプリ開発です。チームで調査と検討を...