使用 gulp 从 node_modules 文件夹中使用引导程序（没有 bower 或 webpack）

Posted 2023-03-07

【中文标题】使用 gulp 从 node_modules 文件夹中使用引导程序（没有 bower 或 webpack）

【英文标题】：Using bootstrap from node_modules folder using gulp (without bower or webpack)

【发布时间】：2017-09-22 03:55:09

【问题描述】：

我在这里阅读了许多类似的资源，但他们要么使用明显过时的 bower，要么使用 webpack，因为我正在从事的项目使用 gulp，所以我现在不打算学习。我的文件结构如下：

      - Project
        - /src
           - /scss
           - /js
           - /img
           - .index.html
        - /dist
        - /node_modules
           - /bootstrap
             -/dist
               - /css
               - /js
        - .package.json
        - .gulfile.js

如何在我的 src/index.html 文件中的 node_modules 文件夹中同时使用 bootstrap css 和 js。（显然最后我还是想使用<script src="js/bootstrap.js"><?script> or better compiled <script src="js/main.js"><?script>） 然后我如何将它编译到 dist 文件夹中，而这两个引导组件仍可用于生产。

希望这是有道理的

【参考方案1】：

由于您使用的是 scss，因此您只需将主 Bootstrap 文件导入到您的文件中

应该是这样的

@import '../../node_modules/bootstrap/dist/css/bootstrap';

对于 Bootstrap 的 JS 部分，您可以简单地编写一个 gulp 任务，将您的脚本和 Bootstrap 连接在一起。您可以使用 gulp-concat! 等软件包轻松实现此目的！

【讨论】：

这根本没有回答我的问题，我认为这不是正确的方法，因为你不能用 js 做到这一点。阅读其他帖子，您不想通过脚本标签公开您的路径，因此它必须运行某种 gulp 任务才能使其正常工作。