包括Webpack的JS档案

Question

我目前正在用webpack做一个项目。如果这个问题看起来很傻，我很抱歉，但这是我的第一个webpack项目，它有点难学。我想在我的项目中添加一个引导模板，但是我很难实现它。我成功地实现了此模板所需的所有css文件，使用：

import "../vendor/bootstrap/css/bootstrap.min.css";
import "../vendor/font-awesome/css/font-awesome.min.css";
import "../vendor/datatables/dataTables.bootstrap4.css";
import "../css/sb-admin.css";

但我很难实现项目所需的Javascript文件。将它们包括在HTML文件中，如下所示：

<!-- Bootstrap core JavaScript -->
<script src="../vendor/jquery/jquery.min.js"></script>
<script src="../vendor/popper/popper.min.js"></script>
<script src="../vendor/bootstrap/js/bootstrap.min.js"></script>

<!-- Plugin JavaScript -->
<script src="../vendor/jquery-easing/jquery.easing.min.js"></script>
<script src="../vendor/chart.js/Chart.min.js"></script>
<script src="../vendor/datatables/jquery.dataTables.js"></script>
<script src="../vendor/datatables/dataTables.bootstrap4.js"></script>

<!-- Custom scripts for this template -->
<script src="../js/sb-admin.min.js"></script>

不起作用。还需要在我的app.js文件中这样做：

// Bootstrap core JavaScript
require("../vendor/jquery/jquery.min.js");
require("../vendor/popper/popper.min.js");
require("../vendor/bootstrap/js/bootstrap.min.js");

// Plugin JavaScript
require("../vendor/jquery-easing/jquery.easing.min.js");
require("../vendor/chart.js/Chart.min.js");
require("../vendor/datatables/jquery.dataTables.js");
require("../vendor/datatables/dataTables.bootstrap4.js");

// Custom scripts for this template
require("../js/sb-admin.min.js");

也不管用。如何将这些JS文件包含到我的项目中？

Answer 1

在webpack中使用引导不是正确的方法。webpack里面有很多装载机是用来引导的。试试引导装载机。此加载程序将加载所需的引导样式和脚本(代码拆分)。由于您是webpack的初学者，我建议您查看youtube上的这视频，以获得更好的理解。