如何在沒有Angular CLI的索引頁中添加引導程序和JQuery參考

Question

我在應用程序中使用VS2015和angular 2。 從角度快速入門解決方案創建了應用程序，對於使用bootstrap css，我從nuget下載了bootstrap和jquery庫。 我通過從Content and scripts文件夾中拖動文件來添加這些參考。

<link href="../Content/bootstrap.css" rel="stylesheet" />
<script src="../scripts/jquery-3.2.1.min.js"></script>
<script src="../scripts/bootstrap.min.js"></script>

在運行應用程序時，它顯示以下錯誤

http：// localhost：2123 / Content / bootstrap.css net :: ERR_ABORTED http：// localhost：2123 / scripts / jquery-3.2.1.min.js net :: ERR_ABORTED http：// localhost：2123 / scripts / bootstrap.min.js 404（未找到）

我嘗試了以下

href="~/Content/ , href="./Content/ ,  href="Content/ Etc.

但是仍然沒有加載。 如何將這些文件添加到“索引”頁面？ 我是angular2的新手，請為我建議一種解決方案。

Answer 1

您可以將所需的文件放在解決方案的ASSETS文件夾中。 添加這些文件后，必須將這些文件的引用添加到angular.cli.json文件中。

有關更多詳細信息，請參閱以下快照。

Answer 2

對於jQuery：

如何在Angular 2中使用jQuery

對於引導程序：

如何在角2中添加引導程序

Answer 3

在此，解決方案是從角度快速啟動文件構建的，有兩種方法可以將引導程序添加到解決方案中。

1. 使用Node.js命令提示符。

2. 使用Visual Studio NuGet程序包管理器

使用nuget添加引導程序時，我們將文件拖入了index.html文件中，但該文件沒有加載到Web瀏覽器中。 我們需要在bs-config-json文件中提供文件夾的路徑。 lite服務器使用此配置。

Lite-server是圍繞BrowserSync的簡單自定義包裝，可輕松提供SPA。 lite-server使用BrowserSync，並允許通過項目中的本地bs-config.json或bs-config.js文件進行配置覆蓋。 更多信息 。 因此，我們需要將bs-config-json的文件夾路徑提供給文件引用。

{
"port" :  2123,
"server": {
"baseDir": "src",
"routes": {
  "/node_modules": "node_modules",
  "/Scripts": "Scripts",
  "/Content": "Content"
  }
 }
}