2ダイナミック<head> Javascriptの角度とCSSライブラリ

私はCSSと、選択した経路に応じて、JSライブラリをスワップアウトする方法を見つけようとしています...私は知っている2ダイナミック<head> Javascriptの角度とCSSライブラリ

<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>MyApp</title> 
    <base href="/"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="icon" type="image/x-icon" href="favicon.ico"> 

    ->if homepage load homepage requirements... 
    ->if admin load admin requirements... 

</head> 
<body> 
    <app-root>Loading...</app-root> 
</body> 
</html>

でこれを行う方法がありますウェブパックがそれを理解するように見えることはできません。前もって感謝します。

出典

2017-03-01 Grant Weiss

-1

angle2ライブラリを追加するとすぐに、そのパワーにアクセスできます。

以降のライブラリでは、ルートに基づいてスクリプトタグを* ngすることができます。

出典

2017-03-01 21:20:12 danday74

「angular2ライブラリを追加するとすぐに、そのパワーにアクセスできます」と、おそらくdownvoteを正当化しますが、推奨される使用法は確実です。 –

Webpackに関する質問に具体的に答えるために、私はWebpackがあなたを手伝ってくれるとは思わない。 Webpackは、配布用のファイルを生成するビルドツールです。あなたが望むことをするためには、ランタイム変数であるルートに基づいて決定する必要があります。これは、Webpackが作業を終えてからずっと前です。しかし、他の解決策があります。

1つの解決方法は、vanilla javascriptを使用することです。

<head> 
    ... 
    <script> 
     var script = document.createElement('script'); 
     script.type = 'text/javascript'; 
     // Implement resource decision logic here however 
     script.src = location.href.includes('admin') ? "//site.com/admin-resource.js" : "//site.com/home-resource.js" 

     $("#body").append(script); 
    </script> 
</head>

jsとcssの両方でこれを行うことができます。

もう1つの解決策は、ページが要求されたときにルートに基づいてサーバーでリンクを動的に生成することです。しかし、私はそれがあなたの角のスパアプリの中からのルートに基づいてこれらのリソースを変更したいと言うことからあなたのために働くとは思わない。

私はこのすべてをお勧めしません。あなたはjavascriptを持っていて、それ以上のサイズのcssファイルの場合は、一度にそれらを読み込むことはできません。おそらく構造上の問題があります。あなたのアプリケーションを2つのモジュール（管理モジュールとメインモジュール）に分割し、各トップレベルのapp.component.htmlファイルにあるリソースへのリンクを配置すると考えられます。

出典

2017-03-02 17:58:17 raykrow

2ダイナミック<head> Javascriptの角度とCSSライブラリ

答えて

関連する問題