Angular 4 Bootstrap js在构建后未加载
Angular 4是一种流行的前端开发框架，而Bootstrap是一个用于构建响应式网页和Web应用程序的开源工具库。在使用Angular 4和Bootstrap js构建应用程序时，有时会遇到构建后未加载的问题。
这个问题通常是由于以下几个原因引起的：
- 资源路径问题：在构建过程中，Angular会对项目中的资源文件进行处理和优化，并将它们放置在构建输出目录中。如果在代码中引用Bootstrap js的路径不正确，浏览器将无法加载该文件。解决方法是确保在代码中正确引用Bootstrap js的路径，可以使用相对路径或绝对路径。
- 构建配置问题：Angular的构建配置文件（通常是angular.json或angular-cli.json）中可能没有正确配置Bootstrap js文件的引入。需要检查构建配置文件，确保Bootstrap js文件被正确地包含在构建过程中。
- 依赖关系问题：Angular应用程序使用npm或yarn等包管理工具来管理依赖关系。如果在项目的依赖关系中没有正确地包含Bootstrap js的依赖项，构建后将无法加载该文件。解决方法是在项目的依赖关系中添加Bootstrap js的依赖项，并重新安装依赖。
解决这个问题的推荐方法是：
- 确保在代码中正确引用Bootstrap js的路径，可以使用相对路径或绝对路径。例如，可以使用以下方式引入Bootstrap js：
<script src="path/to/bootstrap.js"></script>- 检查并更新构建配置文件，确保Bootstrap js文件被正确地包含在构建过程中。例如，在angular.json文件的"scripts"部分添加Bootstrap js的路径：
"scripts": [
"path/to/bootstrap.js"
]- 确保在项目的依赖关系中正确地包含Bootstrap js的依赖项。可以通过运行以下命令来安装Bootstrap js的依赖项：
npm install bootstrap以上是解决Angular 4 Bootstrap js在构建后未加载的一般方法。如果问题仍然存在，可能需要进一步检查项目的配置和依赖关系，或者查阅相关文档和社区支持来解决问题。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云前端开发服务：https://cloud.tencent.com/product/fe
- 腾讯云云原生应用服务：https://cloud.tencent.com/product/tke
- 腾讯云数据库服务：https://cloud.tencent.com/product/cdb
- 腾讯云服务器运维服务：https://cloud.tencent.com/product/cvm
- 腾讯云音视频服务：https://cloud.tencent.com/product/tiia
- 腾讯云人工智能服务：https://cloud.tencent.com/product/ai
- 腾讯云物联网服务：https://cloud.tencent.com/product/iotexplorer
- 腾讯云移动开发服务：https://cloud.tencent.com/product/mob
- 腾讯云存储服务：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务：https://cloud.tencent.com/product/baas
- 腾讯云元宇宙服务：https://cloud.tencent.com/product/um
相关·内容
我使用的是普通的bootstrap 3和Angular 4应用程序。当我用ng serve编译我的应用程序进行开发时，一切都很正常。当我创建ng build时，我的bootstrap.js不再加载。angular-cli中： "scripts": [
浏览 14提问于2017-08-23得票数 2
回答已采纳
当我删除ng-model时，我没有得到错误，但是，当我在输入中包含ng-model时，当我开始在密码/电子邮件字段中输入时，我得到了一个奇怪的角度错误: TypeError: n.is不是一个函数或者TypeErrorsrc="/angular/angular.js"></script>
<script src="/angular-animate/angular</e
浏览 1提问于2016-12-06得票数 0
我们正在使用head.js为我们的网站加载一些外部资源，我们面临着一个问题，在加载了第一个样式表之后，它似乎停止加载样式表。head.js('/lib/bootstrap/docs/assets/css/bootstrap.css',
'/lib/bootstrap/docs/assets&
浏览 3提问于2013-07-09得票数 0
我使用链接在点击时加载json数据。在我的VS2012中重现相同的文件时，我添加了以下js和css文件 <link href="Content/style.css" rel="stylesheet" /> <link href=
浏览 1提问于2015-03-03得票数 1
3回答
MEANjs自定义引导主题
、、、、
我是MEANjs和Bootstrap的新手。
我正在尝试向MEANjs附带的标准core.css添加自定义主题样式。您可以在我的CSS中看到，我已经向svg样式添加了'background:"blue“!important‘属性。但是，背景并没有设置为蓝色。
浏览 2提问于2014-09-30得票数 0
1回答
我有一个AngularJS应用程序，它有一个从左到右的引导菜单滑块。问题在于点击菜单中的链接，页面不被导航。此问题仅出现在所有移动设备和Tab设备中，而不是笔记本电脑/台式机。单击菜单项时，页面应该导航，菜单应该放在从右到左的滑块中，但只有菜单放进去。我知道单击事件是工作的，因为菜单在单击事件时进入。可能的问题是什么。我尝试了z-index，以检查页面的其他部分是否与菜单重叠，但没有任何区别。
浏览 0提问于2016-06-21得票数 0
在功能上，下面的按钮工作正常，但我没有按它应该得到的样式:在这里检查警报示例：
<%@ Page="text/javascript" src="//ajax.googleapis.com/ajax/libs&#x
浏览 4提问于2014-11-12得票数 0
回答已采纳
3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bW
浏览 0提问于2016-12-29得票数 2
我已经为使用AngularJS加载RequireJS组件(由Bower管理)设置了一个非常基本的环境。我的index.html非常基本： </div>
console.log("hello"); &#
浏览 0提问于2015-03-23得票数 2
回答已采纳
如何为运行在NodeJS上的WebApp加载Angular 2库？如果我不使用System.js，它需要ng-app吗？或者我们需要在index.html中特别提到它？
浏览 2提问于2016-06-08得票数 0
当地图最初加载时，地图是垂直拉伸的，但当我调整浏览器的大小时，它是正确的。canvas class="ol-unselectable" style="width: 100%; height: 100%;" width="1090" height="550"></canvas>
然后，在调整大小之后// these functions set the map and other divs to the size of the brow
浏览 0提问于2016-11-01得票数 1
在几次尝试失败后，我转向了。我遵循了基本的过程，但我不断地犯这个严重的错误：
require.config({ angular: 'js/angular.min',
angularAMD: 'js&#x
浏览 3提问于2015-06-02得票数 0
我有一个对象必须加载在AngularJS的启动(它是用户的权限配置文件隐藏/显示部分用户界面，检查也是服务器端完成)。我的第一个想法是使用：但是异步和承诺的特性意味着概要文件可以在其他所有内容之后加载。text/javascript" src="/api/user-profile"></script>var userProfile = {
浏览 2提问于2013-08-21得票数 2
1回答
我有一个带有AngularJS指令的HTML行，我通过一些自2009年以来一直在使用的jQuery控件动态地插入它。我无法更改此控件。但是，我想开始使用angular JS。这是我在100的循环中得到的：
evt.row.cells[glbCandidateListColumnIndex.rank].innerHTML = '<div star-rating rating-value
浏览 2提问于2014-02-13得票数 2
我是一个后端开发人员，我只是在玩弄Angular4。所以我做了这个安装教程：。鉴于此，我如何将bootstrap添加到应用程序中，以便我可以使用"container-fluid“或”or md-6“之类的类？
浏览 12提问于2017-04-22得票数 125
2回答
我正在尝试在我的角度应用程序中使用引导程序。我遵循了这个的说明。但是当我建造这个项目的时候
"bootbox": "^4.4.0", "core-js/bootbox": "^4.4.
浏览 0提问于2018-05-28得票数 1
回答已采纳
2回答
我正在开发一个web应用程序，我一直在使用引导-4功能，然后我决定添加材料设计库来拥有更多的功能，但不幸的是，有些功能在我的页面上发生了变化，比如文本颜色、字体大小和按钮外观。我对此感到困惑，是否有任何规则可以安排调用引导-4和材料设计的链接和脚本文件？或者是关于这些框架的使用的其他东西呢？
浏览 4提问于2017-11-06得票数 3
回答已采纳
1回答
以下是我包含的JS文件：<script src="../public/components/angular-bootstrap/ui-bootstrap-tpls.min.js
浏览 2提问于2014-05-01得票数 0
我已经构建并应用了angularjs (使用angular routing功能)，它调用web api服务进行CRUD操作。当我从visual studio运行应用程序时，一切工作正常。当我在IIS web服务器上部署应用程序时，脚本文件不会加载，因为在以应用程序名称为前缀的路径中进行搜索。我的应用程序的启动页面是Index.html，它有以下代码来加载脚本。>
<script src="/Scripts/angular-rou
浏览 2提问于2017-02-19得票数 0
4回答
我在我的index.html中包含了这些内容，因为bower包含了它们：<script src="bower_components/angular-a
浏览 2提问于2014-08-17得票数 5
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
