Symfony 4 - 使用 webpack encore 导入 ChartJS？答案

【问题标题】：Symfony 4 - Import ChartJS with webpack encore?Symfony 4 - 使用 webpack encore 导入 ChartJS？
【发布时间】：2020-05-23 17:11:47
【问题描述】：

我在 Symfony 上下载了 ChartJS 包，我希望能够将它与 webpack-encore 一起使用

在我的 Twig 模板中，我可以使用 Chart with :

new Chart(document.getElementById("myChart"), { ..... }

它适用于 CDN，但现在我想将它与 webpack-encore 一起使用。

所以在我的 app.js 中我尝试了：

//1er essai
import Chart from "chart.js";
global.Chart = Chart

//2eme essai
const Chart = require("chart.js");
global.Chart = Chart;

但两者都不起作用。每次在浏览器中我都会收到以下错误：

Uncaught ReferenceError: Chart is not defined

有人可以帮帮我吗？

【问题讨论】：

【解决方案1】：

使用 webpack encore 时，我发现通过 npm 安装不同的模块更容易。在documentation 中，它说推荐使用 bower 和 npm。所以你基本上写了这个

npm install chart.js --save

【讨论】：

【解决方案2】：

如果你使用 Yarn（由 Webpack Encore 推荐），只需输入：

yarn add chart.js

然后在你的js文件中：

import Chart from 'chart.js';

new Chart($("#myElement"), {
    ...
});

【讨论】：