当更改路由资产文件夹css或js不加载时，angular2-cli
当更改路由资产文件夹css或js不加载时，angular2-cli
提问于 2017-03-21 17:21:07
- 这是一个有角度的2-cli项目，这是我的第三方css和js在资产文件夹中的问题，所有的资产css和js链接到索引页面，但是当我更改css和js的路由时，它们不能正确加载.当硬重新加载(在url中按enter )时，当前路由css和js文件在一个页面中正确加载，但当我更改路由并转到另一个页面时，问题仍然存在。请帮帮我。我能做什么**
以下是守则：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Some Title</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<!-- Stylesheets -->
<link rel="stylesheet" href="/src/assets/bootstrap/css/bootstrap.min.css"/><!-- bootstrap grid -->
<link rel="stylesheet" href="/src/assets/bootstrap/css/bootstrap-theme.min.css"/><!-- bootstrap theme -->
<link rel="stylesheet" href="/src/assets/css/color-red.css"/><!-- default template color styles -->
<link rel="stylesheet" href="/src/assets/css/retina.css"/><!-- retina ready styles -->
<link rel="stylesheet" href="/src/assets/css/animate.css"/><!-- animation for content -->
<link rel="stylesheet" href="/src/assets/css/colors-header.css"/><!-- header styles -->
<link rel="stylesheet" href="/src/assets/css/odometer.min.css"><!-- Number counter -->
<!-- Magnific pop up plugin css -->
<link rel="stylesheet" href="/src/assets/css/magnific-popup.css"/>
<!-- Font icons -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"/><!-- Fontawesome icons css -->
<!-- Google Web fonts -->
<link href='https://fonts.googleapis.com/css?family=Poppins:300,400,500,700%7CPlayfair+Display:400,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<!-- Hamburger menu list -->
<link rel="stylesheet" href="/src/assets/css/jquery.fatNav.min.css">
<!-- Main stylesheet -->
<link rel="stylesheet" href="/src/assets/css/style.css"/><!-- template styles -->
<link rel="stylesheet" href="/src/assets/css/responsive.css"/><!-- responsive styles -->
</head>
<body>
<app-root> Loading.....</app-root>
<div class="loading">
<h1>Loading...</h1>
</div>
<script src="/src/assets/js/jquery-2.1.4.min.js"></script><!-- jQuery library -->
<script src="/src/assets/bootstrap/js/bootstrap.min.js"></script><!-- .bootstrap script -->
<script src="/src/assets/js/jquery.scripts.min.js"></script><!-- modernizr -->
<script src="/src/assets/js/isotope.pkgd.min.js"></script> <!-- jQuery isotope -->
<script src="/src/assets/js/imagesloaded.pkgd.min.js"></script> <!-- jQuery isotope -->
<script src="/src/assets/js/jquery.magnific-popup.min.js"></script> <!-- Magnific pop up lightbox -->
<script src="/src/assets/odometer/odometer.min.js"></script><!-- Odometer -->
<script src="/src/assets/js/jquery-retina.js"></script><!-- retina -->
<script src="/src/assets/js/jquery.fatNav.js"></script><!-- retina -->
<script src="/src/assets/js/volcanno.include.js"></script><!-- custom js functions -->
<script>
/* <![CDATA[ */
jQuery(document).ready(function ($) {
'use strict';
VolcannoInclude.contactFormAjax('newsletter');
$.fatNav();
jQuery(".number-counter-container").waypoint(function () {
jQuery(".timer-number").each(function () {
var v = jQuery(this).data("to");
var o = new Odometer({
el: this,
value: 0,
duration: 15000
});
o.render();
setInterval(function () {
o.update(v);
});
});
},{
offset: "80%",
triggerOnce: true
});
// OPEN PORTFOLIO LIGHTBOX GALLERY
$('.portfolio-item-hover-button').magnificPopup({
type: 'image',
gallery: {
enabled: true
}
});
});
/* ]]> */
</script>
</body>
</html>**
回答 2
Stack Overflow用户
发布于 2017-03-21 17:33:17
您应该使用角CLI提供的ange-cli.json来加载css文件，并将它们加载到index.html中。你的js文件也是如此。
Stack Overflow用户
发布于 2017-05-16 19:09:43
最好是使用webpack与加载插件，把你的js和css代码注入页面。webpack将自动执行此操作，您只需添加“style-loader”和“css -loader”即可注入css文件，外部js文件将通过以下方式导入：
import '../js/lib.js'但是对于外部js文件，您需要为类型记录编译器添加ts文件才能了解它们。
要加载css样式，必须将其添加到appComponent.ts中。
import '../assets/style.css'页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42934104
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号