无法在 Angular 9 中导入 CanvasJS

Question

CanvasJS 没有 npm 包，因此您必须手动下载它才能在本地使用它。所以，我做到了，将canvasjs.min.js添加到我的项目中并将其导入到我的组件中。但它不起作用：

  ERROR in src/app/survey/survey.component.ts:8:27 - error TS2307: Cannot find module 'src/assets/canvasjs.min.js'.

  import * as CanvasJS from 'src/assets/canvasjs.min.js';

                            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

这是我的树文件夹：

- src

 -- app

  --- survey

  ---- survey.component.ts

 -- assets 

  --- canvasjs.min.js

在我的组件中，我包含了这样的库：

import * as CanvasJS from 'src/assets/canvasjs.min.js';

这是我的项目根目录中的所有 jsons 配置： tsconfig.spec.json

 {

  "extends": "./tsconfig.json",

  "compilerOptions": {

    "outDir": "./out-tsc/spec",

    "types": [

      "jasmine",

      "node"

    ]

  },

  "files": [

    "src/test.ts",

    "src/polyfills.ts"

  ],

  "include": [

    "src/**/*.spec.ts",

    "src/**/*.d.ts"

  ]

}

tsconfig.json

{

  "compileOnSave": false,

  "compilerOptions": {

    "baseUrl": "./",

    "outDir": "./dist/out-tsc",

    "sourceMap": true,

    "declaration": false,

    "downlevelIteration": true,

    "experimentalDecorators": true,

    "module": "esnext",

    "moduleResolution": "node",

    "importHelpers": true,

    "target": "es2015",

    "lib": [

      "es2018",

      "dom"

    ]

  },

  "angularCompilerOptions": {

    "fullTemplateTypeCheck": true,

    "strictInjectionParameters": true

  }

}

tsconfig.app.json

{

  "extends": "./tsconfig.json",

  "compilerOptions": {

    "outDir": "./out-tsc/app",

    "types": []

  },

  "files": [

    "src/main.ts",

    "src/polyfills.ts"

  ],

  "include": [

    "src/**/*.d.ts"

  ]

}

我已经尝试过：

• 在 angular.json 的脚本中添加路径

• 将 .js 移动到任何文件夹中的任何位置

• 用绝对路径和相对路径改变我的路径

• 更改 baseUrl

Answer 1

我建议将其导入您angular.json的脚本部分。"scripts": [  .....  "/assets/canvasjs.min.js"]现在您应该可以将 canvas js 声明为any并且可以使用了。declare const CanvasJS: any;...export class MyClass {   public chart = new CanvasJS.Chart("chartContainer", {      ....}