1. 程式人生 > >Angular6引入Bootstrap等第三方類庫無效

Angular6引入Bootstrap等第三方類庫無效

博主學習Angular時引入第三方類庫總是不成功,於是便訪問了谷歌和百度,可算找到了解決方法,分享給大家~

1.類庫引用路徑問題

  • Angular6的命令列工具配置檔案從angular-cli.json更名為angular.json,且路徑變更
  • 需要對檔案中的資訊作如下調整
// 調整前
"styles":[
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.css"
],
"scripts":[
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/bootstrap/dist/js/bootstrap.js"
] // 調整後 "styles":[ "src/styles.css", "node_modules/bootstrap/dist/css/bootstrap.css" ], "scripts":[ "node_modules/jquery/dist/jquery.js", "node_modules/bootstrap/dist/js/bootstrap.js" ]
  • 修改後需要重啟服務才可以生效

2.注意事項

  • 修改後要重啟服務才可以生效
  • 請務必確認修改的是build下的scripts和styles,否則一樣是不生效的~