Symfony 4 - 使用 webpack encore 導入 ChartJS？

Question

我在 Symfony 上下載了 ChartJS 包，我希望能夠將它與 webpack-encore 一起使用

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

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;

但兩者都不起作用。 每次在瀏覽器中我都會收到以下錯誤：

未捕獲的 ReferenceError：圖表未定義

有人能幫助我嗎 ？

Answer 1

使用 webpack encore 時，我發現通過 npm 安裝不同的模塊更容易。 在文檔中它說推薦使用 bower 和 npm。 所以你基本上寫這個

npm install chart.js --save

對於使用，您只需導入它。

Answer 2

如果您使用 Yarn（由 Webpack Encore 推薦），只需輸入：

yarn add chart.js 

然后在你的 js 文件中：

import Chart from 'chart.js';

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