时间戳

首页 > 解决方案 > Webpack 4 正在摇树引导，我该如何防止呢？

javascript - Webpack 4 正在摇树引导，我该如何防止呢？

问题描述

我正在尝试获取一个使用 Jquery 模态插件的旧版应用程序，该插件需要引导程序的 javascript 才能在使用自定义 Webpack 配置的 Angular 6 和 Webpack 4 项目中工作。一切正常，除了捆绑期间发生的摇树正在删除我vendor.ts文件中的引导导入，因为我在我的应用程序中没有明确使用引导导入。

这会导致我的引导模式和引导下拉菜单中断。

注意：如果我添加类似：

import * as bootstrap from "bootstrap";
console.log(bootstrap);

对于我的main.ts文件，webpack 不会删除引导程序，并且一切正常。

我已经尝试向文档package.json中建议的 sideEffects 属性添加多个条目，但我认为该属性用于标记应删除的代码。有没有办法将导入的模块标记为不从摇树过程中删除？

我也尝试过这样的ProvidePlugin：

new ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
    "window.jQuery": "jquery",
    _: "underscore",
    bootstrap: "bootstrap",
    moment: "moment",
    momenttimezone: "moment-timezone",
    // Collapse: "exports-loader?Collapse!bootstrap/js/dist/collapse",
    // Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown",
    Modal: "exports-loader?Modal!bootstrap/js/dist/modal",
})

谢谢你的时间。

标签： javascriptangularwebpacktree-shaking

解决方案

我遇到了同样的问题，解决方案如下：

不要使用“import”，而是使用“require”。

改变这个

import * as bootstrap from "bootstrap";

对此

require("bootstrap");

不幸的是，我还没有弄清楚如何使它与“导入”一起使用。

推荐阅读