vuejsでlessを使用する方法

方法: 1. インストールする依存関係を減らします。 2. 「webpack.config.js」ファイルを変更し、サポートする依存関係をロードするようにローダーを構成します。 3. 「」を必要なページの「コードが少ない」というステートメントで十分です。

このチュートリアルの動作環境: Windows7 システム、vue2.9.6 バージョン、DELL G3 コンピューター。

#vuejs 構成の使用量は少なくなります

最初のステップ: インストールする依存関係を少なくします。

npm install less less-loader --save

ステップ 2:

webpack.config.js ファイルを変更し、依存関係をロードするようにローダーを構成し、外部 Less をサポートできるようにし、元のコードに

{

  test: /\.less$/,

  loader: "style-loader!css-loader!less-loader",

},

を追加します。以上でインストールは完了です。

第三段階:Useless

使用する場合は、styleタグにlang="less"を追加すると以下のように記述できます。内部のコードが少なくなるほど、スコープ付きの

style タグを追加すると、このスコープでのみ有効になることを意味します

<style lang="less" scoped></style>

或者@import './index.less'; //引入全局less文件

関連する推奨事項: "

vue.js チュートリアル"

以上がvuejsでlessを使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。