【发布时间】：2018-01-24 11:11:38
【问题描述】：
我在 ASP.NET Core + Angular 中有一个应用程序。用 Yeoman 搭建的 VS Code 中配置的最简单的应用程序。
据我所知，如果在引导部分之后加载 jquery 部分，则 Bootstrap 下拉切换类存在一个旧问题（菜单不会切换）。
据我了解，这不应该是 webpack 包和运行时执行的问题。
无论如何，我已经花了几个小时试图让它工作，并且完全没有其他可以尝试的选项。有没有其他人遇到过类似的问题？谢谢。
所以首先我认为这是因为 vendor.js 是在 asp-prerender-module 之后加载的，所以我更改了顺序，但这并没有帮助。这是视图现在的样子。
@{
ViewData["Title"] = "Home Page";
}
<script src="~/dist/vendor.js" asp-append-version="true"></script>
<app asp-prerender-module="ClientApp/dist/main-server">Loading...</app>
@section scripts {
<script src="~/dist/main-client.js" asp-append-version="true"></script>
}
在 vendor.js 之前在 app 标签之后。然而，这并没有真正做任何事情。
现在显然 bootstrap 和 jquery 文件夹和内容都在 node_modules 文件夹中，并以各种可能的方式引用（我尝试更改 package.json 中的顺序），所以这是 package.json 现在的样子.
"name": "WebApplicationBasic",
"version": "0.0.0",
"dependencies": {
"@angular/animations": "4.1.2",
"@angular/common": "4.1.2",
"@angular/compiler": "4.1.2",
"@angular/core": "4.1.2",
"@angular/forms": "4.1.2",
"@angular/http": "4.1.2",
"@angular/platform-browser": "4.1.2",
"@angular/platform-browser-dynamic": "4.1.2",
"@angular/platform-server": "4.1.2",
"@angular/router": "4.1.2",
"@types/node": "7.0.18",
"angular2-template-loader": "0.6.2",
"aspnet-prerendering": "^2.0.5",
"aspnet-webpack": "^1.0.29",
"awesome-typescript-loader": "3.1.3",
"bootstrap": "3.3.7",
"css": "2.2.1",
"css-loader": "0.28.1",
"es6-shim": "0.35.3",
"event-source-polyfill": "0.0.9",
"expose-loader": "0.7.3",
"extract-text-webpack-plugin": "2.1.0",
"file-loader": "0.11.1",
"html-loader": "0.4.5",
"isomorphic-fetch": "2.2.1",
"jquery": "3.2.1",
"json-loader": "0.5.4",
"preboot": "4.5.2",
"raw-loader": "0.5.1",
"reflect-metadata": "0.1.10",
"rxjs": "5.4.0",
"style-loader": "0.17.0",
"to-string-loader": "1.1.5",
"typescript": "2.3.2",
"url-loader": "0.5.8",
"webpack": "2.5.1",
"webpack-hot-middleware": "2.18.0",
"webpack-merge": "4.1.0",
"zone.js": "0.8.10"
}
}
我也尝试过引用 .angular-cli.json 中的库（实际上这种方式有助于我的其他项目，它只是 angular 没有 asp），所以你可以在 scripts 标签下看到有一个参考
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "myapp"
},
"apps": [
{
"root": "ClientApp",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.css"
],
"scripts": [
".././node_modules/jquery/dist/jquery.min.js",
".././node_modules/bootstrap/dist/js/bootstrap.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json",
"exclude": "**/node_modules/**"
},
{
"project": "src/tsconfig.spec.json",
"exclude": "**/node_modules/**"
},
{
"project": "e2e/tsconfig.e2e.json",
"exclude": "**/node_modules/**"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "css",
"component": {}
}
我使用 dotnet watch run 进行编译，我尝试了生产和开发环境。说实话，我想我现在已经尝试了很多选择，以至于我真的不明白发生了什么。
【问题讨论】：
-
如果没有看到您的代码，我们真的无法提供帮助，但是我可以保证，在 jQuery 之前加载任何与 Bootstrap 相关的内容都会是一个问题，因为 BS 依赖于 jQ。
-
谢谢。我现在将用一些代码更新问题。
-
我添加了一些代码和我已经尝试过的事情的完整故事，也许这可以澄清一些事情。