关于angular4通过npm安装bootstrap插件在启动时候报错问题。

  昨天在学习angular4框架的时候,通过npm安装bootstrap插件,但是在启动的时候ng serve会在控制台输出错误。当bootstrap.css从angular-cli.json中移除之后, ng serve就可以正常启动。推断的话是angular环境的问题,在将Ide(webstrom)升级到2017.2同时升级了TypeScript的版本后,之前在编辑app.component.ts时jQuery的$不能被识别的问题解决了。但是在通过Ng serve启动的时候还是报同样的错。

之前angular-cli.json的配置为:

  在StackOverflow上看到有人解决了这样的问题,Bootstrap 4 not working with Angular 2 app 具体的文章链接为: https://stackoverflow.com/que...
文章的大概意思是说,通过npm install bootstrap --save这种方式已经不推荐使用,应该转而使用npm install [email protected] popper.js jquery --save
并且在angular-cli.json中的配置如下:

"styles": [
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.min.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/popper.js/dist/popper.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.min.js"
  ],

按照这种方式重新安装bootstrap的插件之后,重启服务Ng serve就可以正常访问。如果你也有遇到这样的问题,希望可以帮助到你。

你可能感兴趣的:(bootstrap,npm,angular)