ホームページ  >  記事  >  ウェブフロントエンド  >  vue.jsにCSSファイルを導入する方法

vue.jsにCSSファイルを導入する方法

coldplay.xixi
coldplay.xixiオリジナル
2020-11-09 11:17:244036ブラウズ

vue.js に CSS ファイルを導入する方法: 1. [main.js] でグローバルにインポートします。コードは [import "./common/uni.css"] です。 2. に直接導入します。コンポーネントのコードは [@import "/common/uni.css";] です。

vue.jsにCSSファイルを導入する方法

【おすすめ関連記事:vue.js

vue.js に css ファイルを導入する方法:

css ファイルを導入する 2 つの方法

最初の 1 つ: js の導入

は通常、main.js でグローバルに導入される、つまり次のような書き方になります:

import "./common/uni.css"

注:

1. この書き方が適用されます。こちら cssファイルがプロジェクト内に存在するため、URLアクセスによる導入には適さないため、エラーが報告されます。

2. アプリ プラットフォーム v3 モードは現在、js ファイルでの「./common/uni.css」の参照をサポートしていません

2 番目のタイプ: CSS の導入

コンポーネントに直接導入するのは比較的簡単です

<style>
    @import "/common/uni.css";
</style>

注:

導入ステートメントの後にセミコロンを追加することをお勧めします。引用符は 1 つだけでも問題ありません。セミコロンなしで複数引用すると、エラーが報告されます。

もちろんrequire()を使って導入したものもあるのですが、とりあえずはimportを使うほうが慣れてきました。

関連する無料学習の推奨事項: javascript (ビデオ)

以上がvue.jsにCSSファイルを導入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。