web-dev-qa-db-ja.com

bootstrap 4（ベータ）nugetパッケージを.Net MVC（.Netバージョン4.6.2）にインストールできない

MVCプロジェクトにbootstrap 4(beta)をインストールできません。正確には、popper.js nugetの依存関係をインストールできません。それを行うための可能な方法を知っています（bowerのインストールはまだ方法ですが、私はnugetで行きたいです）

パッケージ「popper.js 1.11.0」をインストールできませんでした。 '.NETFramework、Version = v4.6.2'をターゲットとするプロジェクトにこのパッケージをインストールしようとしていますが、パッケージには、そのフレームワークと互換性のあるアセンブリ参照またはコンテンツファイルが含まれていません。詳細については、パッケージの作成者にお問い合わせください

nugetbootstrap-4popper.js
14
Debananda

最終的にBootstrap 4-Betaが次のように動作するようになりました。

1.）popper.js NuGetパッケージV1.12.3をインストールします

2.）Bootstrap4-beta NuGetパッケージをインストールする

3.）BundleConfig.csを更新して、次を含めます。popper.jsのパスに注意してください

bundles.Add(new ScriptBundle("~/Scrpts/Bootstrap").Include(
                             /*** Make sure popper.js is pointing to umd ***/
                             "~/Scripts/umd/popper.js", 
                             "~/Scripts/bootstrap.js",
                             ));

bundles.Add(new StyleBundle("~/CSS/Bootstrap").Include(
                            "~/Content/bootstrap.css"));

何らかの理由で、\Scriptsフォルダーのルートでpopper.jsを使用しようとすると、エラーが表示されます。

SyntaxError: export declarations may only appear at top level of a module

しかし、/Scripts/umdのバージョンは動作しているようです。

14
Andy Braham

これを回避するには、popper.jsパッケージをパッケージ構成に手動で追加します。

<package id="popper.js" version="1.11.1" targetFramework="net462" />

その後、nugetパッケージマネージャーに移動して、通常どおりにインストールできます。

5
Alex Boutin Flegel

bootstrap 4.0に更新する前に、最新（執筆時点で1.12.3）のpopper.js nugetパッケージをダウンロードすることで、この問題を回避することができました。

次にbundles.configで、このようなポッパーjsを追加しました

bundles.Add(new ScriptBundle("~/bundles/popper").Include(
                      "~/Scripts/umd/popper.js"));

Umdバージョンは私のために働いた唯一のものであり、他のバージョンはコンソールエラーを与えました

認識されないトークンのエクスポート

bootstrap one。の前に必ずpopper jsファイルを含めるようにしてください。

@Scripts.Render("~/bundles/popper")
@Scripts.Render("~/bundles/bootstrap")

また、これは、以前のバージョンのブートストラップに基づいているため、自動生成されたテンプレートの大部分を壊したことにも気付きました。ナビゲーションバーはほぼ完全に消えます。私はそれを次のものに置き換えることでなんとか修正しましたが、これにはモバイルメニューの項目は含まれていません。

<div class="navbar navbar-expand-lg navbar-dark bg-dark">   
        <a class="navbar-brand" href="#">My Blog</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse">
            <ul class="navbar-nav">
                <li class="nav-item">@Html.ActionLink("Home", "Index", "Home", new { @class = "nav-link" })</li>
                <li class="nav-item">@Html.ActionLink("About", "About", "Home", new { @class = "nav-link" })</li>
                <li class="nav-item">@Html.ActionLink("Contact", "Contact", "Home", new { @class = "nav-link" })</li>
            </ul>                
        </div>        
    </div>

この質問にはいくつかの良い答えがありますが、これは私のために働いた完全な解決策でしたので、将来誰かに少し時間を割けることを願って共有したいと思いました。

2
Numli

ここで同じ問題...私はこれのためにGitHubで問題を作成しました： https://github.com/FezVrasta/popper.js/issues/387

1
TrustNo_1

NuGetを使用してパッケージをインストールする前に、「オプション」を展開し、「依存動作」を「最高」に変更します。パッケージをインストールすると、最新のpopper.jsが最初にインストールされ、bootstrap=もインストールできるようになります。

これにより、ポッパーを個別にインストールする必要がなくなりました。

1
Nick

Popper.js NuGetパッケージは、バージョン1.12.2まで壊れていました。
ブートストラップにはまだバージョン1.11.xが必要ですが、残念ながら壊れています。

この問題を解決するには、Bootstrapを待つ必要があります。
https://github.com/twbs/bootstrap/issues/23622

一方、 Rob Quincey の提案に従うことができます。

1
Fez Vrasta

Popperに付属するすべてのファイルとフォルダー、TypeScript関連のコード、NuGetおよびデバッガーメッセージに満足できなかったため、次のようにCDNを使用しています。

@ Scripts.Render（ "〜/ bundles/jquery"）

    <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>

これまでのところ、すべて正常に機能しています。

0
JaneH

ASP.NET Webformを使用する場合：

パッケージ（Bootstrap、Popper、jQuery）がプリインストールされた新しいプロジェクトを作成し、それらを最新バージョンに更新して以下を実行しました。

  1. App_Start/BundleConfig.csに追加

    _bundles.Add(new ScriptBundle("~/bundles/popper").Include(
          "~/Scripts/umd/popper.js"));
_

  2. ヘッダーに追加（マスターページ）

    <asp:PlaceHolder runat="server"> <%: Scripts.Render("~/bundles/popper") %> <%: Scripts.Render("~/bundles/bootstrap")%> </asp:PlaceHolder>

0
fubo

繰り返しますが、修正ではありませんが、@ Alexによる修正と同様です。

NuGetを使用して個別にインストールすることで解決したので、まずpopperjsをインストールし（NuGetパッケージマネージャーでpopperを検索してください）、次にBootstrap 4をインストールします。スタンドアロンではなく依存関係としてダウンロードします。非常に奇妙です。

0
Rob Quincey