angualr引入bootstrap部分效果失效。

  周末没事儿做,闲着也是闲着,就看了一下angular的项目开发的视频,按照视频中的例子一步一步的做,发现一个问题,(视频中讲的跟自己实际中做的都不一样,视频中的东西一步就可以通过,自己做的话,步步报错,说笑的),还是发现了一些问题的。

比如说angular中引入jQuery和bootstrap,npm i jquery -- save 和npm i bootstrap --save 命令可以引入,

只引入了,不能使用,因为angular中使用的typescript语法,

所以还要用以下的命令加进去:npm i @types/jquery --save-dev npm i @types/bootstrap --save-dev;

在.angular-cli.json文件中的apps下的styles和scripts里分别写入(百度的)

   "../node_modules/_bootstrap@3.3.7@bootstrap/dist/css/bootstrap.min.css",                    

   "../node_modules/_jquery@3.2.1@jquery/dist/jquery.js",
    "../node_modules/_bootstrap@3.3.7@bootstrap/dist/js/bootstrap.min.js"

可是发现视频中的一个navbar 控件在我自己中的项目中死活不起作用 (navbar-inverse navbar-fixed-top)

,后来查资料才发现,是因为bootstrap的版本(4.1.1)的问题,最近的版本要使用 navbar navbar-dark bg-dark,

经过半天的折腾还是有收获的,哈哈。

 
原文地址:https://www.cnblogs.com/lsy26821/p/8998954.html