从命令行运行此命令：

npm install chart.js

在webpack.mix.js中添加以下行：

mix.copy('node_modules/chart.js/dist/chart.js', 'public/chart.js/chart.js');

然后从命令行运行此命令：

npm run dev

在要在其上显示图表的刀片中：

<script src="{{ asset('chart.js/chart.js') }}"></script>
<canvas id="myChart" width="500" height="200"></canvas>
<script>
  var ctx = document.getElementById('myChart').getContext('2d');
  var myChart = new Chart(ctx, { 
  ...
  }
</script>

您可以在app.js中注册一个全局Chart变量，如下所示：

// Chart JS
import Chart from 'chart.js/auto';
window.Chart = Chart;

然后您可以在视图或其他JS文件中使用new Chart(....)

我有一些问题。
首先，我不能通过NPM引入库。我安装了它，然后我执行“npm run dev”。但是当我在应用程序中调用它时，它说

1:2573 Uncaught ReferenceError: Chart is not defined
    at 1:2573

如果我从CDN调用它，它会与VUE或Bootstrap的某些部分冲突。因为它不起作用。除了我从app.blade.php的行中删除“defer”字：

<script src="{{ asset('js/app.js') }}" defer></script>

但是同样，只能通过CDN调用Charts.Js。不能从NPM带来它。
希望有人也有同样的问题。谢谢。赫南。

我会使用这个库https://github.com/ConsoleTVs/Charts。
快跑...

composer require consoletvs/charts

然后发布配置文件：

php artisan vendor:publish --tag=charts_config

在config/charts.php中指定图表类型：

'default_library' => 'Chartjs',

安装：

npm i chart.js

然后按照创建图表的说明进行操作。
https://charts.erik.cat/create_charts.html#create-a-chart-class

“岩浆"的答案很接近。
对于较新的版本，如我使用v4. x。修改位：
mix.copy（“节点模块/Chart.js/分布/图表.umd.js”，“公共/js/图表. js”）;
添加另一个以隐藏错误通知：
mix.copy（“节点模块/Chart.js/分布/图表.umd.js.Map”，“公共/js/图表.umd.js.Map”）;混合.copy（“节点模块/Chart.js/分布/助手.js.Map”，“公共/js/助手.段.js.Map”）;