Raphael.js不适用于本地文件，仅与CDN有关，我有什么问题吗？

Question

正如标题所说，我的这段代码运行良好，没有错误

<!-- Scripts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.7/raphael.js" integrity="sha256-MPXjTSEImVJI1834JAHubdK7Lts1VTUPJmCQ9zKAjyA=" crossorigin="anonymous"></script> 

<script src="{{ asset('js/chart.min.js') }}" type="application/javascript" defer></script>
<script src="{{ asset('js/app.js') }}" type="application/javascript" defer></script>
</body>

但是如果我使用其他代码，它将在检查器中给我这个错误：

    app.js:10091 jQuery.Deferred exception: Raphael is not defined ReferenceError: Raphael is not defined
    at Bar.Grid [as constructor] (http://localhost:3000/js/app.js:56940:26)
    at new Bar (http://localhost:3000/js/app.js:58500:33)
    at Object.Bar (http://localhost:3000/js/app.js:58497:16)
    at Object.initFunction (http://localhost:3000/js/app.js:38175:14)
    at HTMLDocument.<anonymous> (http://localhost:3000/js/app.js:38339:13)
    at mightThrow (http://localhost:3000/js/app.js:9807:29)
    at process (http://localhost:3000/js/app.js:9875:12) undefined

这是代码：

<script src="{{ asset('js/raphael.js') }}" type="application/javascript" defer></script>
<script src="{{ asset('js/chart.min.js') }}" type="application/javascript" defer></script>
<script src="{{ asset('js/app.js') }}" type="application/javascript" defer></script>
</body>

我的app.js文件看起来像这样：

require('./bootstrap');
require('./vendors/morris/morris');
require('./vendors/easypiechart/easypiechart-data');
require('./vendors/easypiechart/easypiechart');
require('./vendors/Metismenu/jquery.metisMenu');
require('./vendors/Webthemez/custom-scripts');
require('./vendors/Webthemez/custom');
require('./vendors/chart/chart.min');
require('./vendors/chart/chart-data');
require('./vendors/Lightweight-Chart/jquery.chart');
require('./vendors/Lightweight-Chart/chart');
require('./vendors/font-awesome/select2.full.min');
require('./vendors/dataTables/jquery.dataTables');
require('./vendors/dataTables/dataTables.bootstrap');

我已经做过的一些事情：

• 检查我是否在public / js中拥有所有必需的文件
• 从CDN下载raphael版本以在本地使用
• 从app.js调用raphael
• 与app.js和chart.min.js交换订单（如果更改订单CDN也将停止工作）

任何人都知道我如何使它在本地工作？我错了吗？我的项目在laravel中，也是第一次使用laravel，但我不确定是否与问题有关

---

编辑

我想出了问题，但我仍然不知道如何正确解决。Laravel.mix和webpack损坏了文件。

我下载了此版本的raphael raphael-2.1.0.min.js并将其直接复制到public / js上，并且使用此代码都可以正常工作：

<script src="{{ asset('js/raphael-2.1.0.min.js') }}" type="application/javascript"></script>
<script src="{{ asset('js/app.js') }}" type="application/javascript"></script>

但是如果我像这样从webpack.mix.js中的resources / js编译相同的文件：

mix.js('resources/js/vendors/morris/raphael-2.1.0.min.js','public/js');

public / js中的结果不再起作用。

所以我认为我必须直接在public / js上使用它，并且不能像所有其他扩展一样从app.js进行编译？

至少它起作用了，尽管不是我所期望的

---

已解决

mix.copy('resources/js/vendors/morris/raphael-2.1.0.min.js', 'public/js');

我找到了此代码，将文件复制成功，出现错误！ ：）

Answer 1

解决该问题的另一种方法是将raphael js与npm一起安装。 Here您可以在npmjs.com上找到存储库。

通过执行安装：

npm我反应-拉斐尔

运行命令后，您可以在app.js文件中要求它。如果您要像这样导入外部库，则只需添加/加载一个js文件（在您的情况下为app.js），而无需在网站中添加多个文件。