6つのビュー(html)を持つプロジェクトがあります。これらのビューのそれぞれに対応するビューモデル(.js)とそのビュー(.css)用のスタイルシートがありますAurelia-CLIを使用したCSS管理:すべてのビューが、サイト全体に適用される別のCSSファイルをロードして競合を引き起こします。
aurelia-cliはファイルを自由に再帰し、すべての.jsと.cssファイルを2つのファイルに分割して、ページの読み込み時間とサイズを削減しながら参照できるようにします。 welcome.html、welcome.js、welcome.cssのウェルカムフォルダがあればwelcome.htmlのCSSを次のようにロードして<require from="./welcome.css"></require>
とし、CSSはページロード時に<head></head>
タグに挿入されます。 Iがのwelcome.html/welcome.cssからCSSルールは、このようにまだ適用されているウェブページの<head>
タグ内に残っている次のビューにナビゲートするときにと
問題があります。私のアプリケーションで6つのビューをすべて閲覧した後は、<head>
タグ内に6 <style>
タグがあり、6ページすべてのルールが、ページがリフレッシュされるまでアンロードされずにすべてのページに適用されます。言うまでもなく、いくつかのページを訪問した後、サイト全体が混乱してしまいます。
だから私の質問は
- あるなぜこれが
- 機能ですが、私はここでのベストプラクティスをしないのですか?
- 訪問したときにページのCSSを読み込み、ナビゲートしたときに読み込みを解除し、新しいページを読み込む方法はありますか?
私はグローバルスタイルシート、ブートストラップ、CSSをアニメーション化し、私はHTMLに恒久的にアプリの残りを注入し14の相反するスタイルを持って一日の終わりに、素晴らしいフォントで10ページのアプリを持っていた場合に注入されるとに。
提案がありますか?読んでくれてありがとう。
なぜ私はaureliaがCSSをアンロードしないのか混乱させていると思います。私は、複数のページでCSSを使って音声ロジックを見つけられません。これはどのようなメリットがありますか?私はあなたの解決策を見ていきますが、これがgithubの問題として浮上しているのだろうかと思います。利点が得られない場合は修正する必要があります。 –
あなたは希望の順序でscssファイルをインポートするためにsassの@import機能を使用できませんでしたか?次に、アプリケーション自体からトップレベルのscssファイルを要求するだけです。 – pQuestions123
実際には、特定の変数ファイル(つまり色など)に設定された変数にアクセスできないという別の問題が発生します。私の解決策は、すべてのscssを1つのマスターscssファイル(上にcolors.scssをインポートする)にインポートすることです。その後、すべてのファイルのすべての色にアクセスできます。あなたがする必要があることは、その1つのマスターファイルをトランキライズすることだけです。 – pQuestions123