小编use*_*973的帖子

将 ChartJS v3 与 TypeScript 和 Webpack 一起使用

直到版本 2.9.4为止,我将 ChartJS 与@types/chart.js结合使用来获取 TypeScript 支持的所有类型。我使用 Webpack 和 TypeScript 的最小工作示例如下所示:

包.json:

{
  "devDependencies": {
    "@types/chart.js": "^2.9.31",
    "ts-loader": "^8.1.0",
    "typescript": "^4.2.3",
    "webpack": "^5.30.0",
    "webpack-cli": "^4.6.0",
    "webpack-dev-server": "^3.11.2"
  },
  "dependencies": {
    "chart.js": "^2.9.4"
  }
}
Run Code Online (Sandbox Code Playgroud)

tsconfig.json:

{
  "compilerOptions": {
    "esModuleInterop": true,
  },
}
Run Code Online (Sandbox Code Playgroud)

webpack.config.json:

module.exports = {
  entry: {
    main: "./main.ts",
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        loader: "ts-loader",
        exclude: /node_modules/,
      },
    ],
  },
};
Run Code Online (Sandbox Code Playgroud)

主要.ts:

import Chart from "chart.js";

new Chart("chart", {
  type: 'line',
  data: { …
Run Code Online (Sandbox Code Playgroud)

javascript typescript webpack chart.js chart.js3

6
推荐指数
1
解决办法
8823
查看次数

标签 统计

chart.js ×1

chart.js3 ×1

javascript ×1

typescript ×1

webpack ×1