[JavaScript知识库]【angular-基础教程】引入外部js

步骤

1.将引入的外部js文件放到assets文件下

2.在angular.json文件中找到scripts配置js文件路径

(注意不要添加到test标签下的scripts中)

"scripts": [
    "src/assets/lib/echarts.js",
    "src/assets/lib/jquery-2.1.1.min.js",
    "src/assets/js/test.js",
    "src/assets/js/swiper.min.js",
    "src/assets/js/visual.js"
]

3.在tsconfig.json文件中加入allowJs:true

{
  "compileOnSave": false,
  "compilerOptions": {
    ...
    
    "allowJs": true,
    
    ...
  },

4.在src文件下新建typings.d.ts文件，用来定义js文件中的静态类型

typings.d.ts

declare function funInEchart(): any;
    
declare var aaa:number

echarts.js

var aaa = 123

function funInEchart() {
    console.log("funInEchart")
}

5.在组件的ts文件中调用

ngOnInit(): void {
    funInEchart()
    console.log(aaa)
}

参考

• https://www.jianshu.com/p/79a85588e565
• http://www.qianduanheidong.com/blog/article/35741/a28dd6a4fd2effe496f2/
  • 例子是echart
• https://blog.csdn.net/chanchaw/article/details/99400141
• Angular(Typescript)引用第三方js
  • 引入bootstrap