Webpack 正确地不包含死代码,但捆绑了死代码的依赖项
Webpack correctly does not include dead code, but bundles a dependency of the dead code
我在捆绑 isomorphic/universal 应用程序时遇到问题。出于某种原因,treeshaking 和 uglify 都完全忽略了 MongoDB 未在任何代码路径中使用并将其包含到我的浏览器包中的事实,这使得它非常大(1.3 MB)并且无法使用(因为本机 Node 模块).它应该省略所有 MongoDB 相关代码,因为它未被使用。它甚至正确地从包中删除了死代码分支,但 MongoDB 依赖项仍然存在,未被使用。
我的入口点(index.js):
import { TestService } from "../../services/TestService";
import { container, services } from "../../ioc";
const test = container.get("test");
test.retrieveTestMessage.then((result) => console.log(result));
ioc.js:
// omitted Inversify setup
import { TestService } from "./services/TestService";
if (DEPLOYMENT_NODE == true) // DefinePlugin sets this to false; only the 'else' branch is correctly included in the bundle
{
container.bind("test").to(TestService);
}
else
{
container.bind("test").toConstantValue(createClient(API_URL, "test"));
}
TestService.js:
import { injectable } from "inversify";
import { MongoClient } from "mongodb";
@injectable()
export class TestService
{
public async retrieveTestMessage()
{
if (DEPLOYMENT_NODE == true)
{
// omitted MongoClient usage
}
}
}
创建客户端函数:
export function createClient(url, service)
{
const client = new Proxy(
{},
{
get: (target, property, receiver) => async (...params) => fetch(url, { headers: new Headers({ "Content-Type": "application/json" }), method: "POST", body: JSON.stringify({ id: 0, service: service, method: property, parameters: params }) })
}
);
return client;
}
我尝试在我的 Webpack 配置中使用 webpack.IgnorePlugin(/mongodb/)
,但它确实不包含 MongoDB,但随后捆绑失败并出现 "MongoDB module not found" 错误,即使它没有被使用全部.
如果有人有任何其他建议,我们将不胜感激。谢谢。
编辑:我正在使用最新的 Webpack 2 beta 并在我的 babel 配置中保留 ES6 模块。
if
条件下的显式要求应该有效
import { injectable } from "inversify";
@injectable()
export class TestService
{
public async retrieveTestMessage()
{
if (DEPLOYMENT_NODE == true)
{
const { MongoClient } = require("mongodb");
// omitted MongoClient usage
}
}
}
我在捆绑 isomorphic/universal 应用程序时遇到问题。出于某种原因,treeshaking 和 uglify 都完全忽略了 MongoDB 未在任何代码路径中使用并将其包含到我的浏览器包中的事实,这使得它非常大(1.3 MB)并且无法使用(因为本机 Node 模块).它应该省略所有 MongoDB 相关代码,因为它未被使用。它甚至正确地从包中删除了死代码分支,但 MongoDB 依赖项仍然存在,未被使用。
我的入口点(index.js):
import { TestService } from "../../services/TestService";
import { container, services } from "../../ioc";
const test = container.get("test");
test.retrieveTestMessage.then((result) => console.log(result));
ioc.js:
// omitted Inversify setup
import { TestService } from "./services/TestService";
if (DEPLOYMENT_NODE == true) // DefinePlugin sets this to false; only the 'else' branch is correctly included in the bundle
{
container.bind("test").to(TestService);
}
else
{
container.bind("test").toConstantValue(createClient(API_URL, "test"));
}
TestService.js:
import { injectable } from "inversify";
import { MongoClient } from "mongodb";
@injectable()
export class TestService
{
public async retrieveTestMessage()
{
if (DEPLOYMENT_NODE == true)
{
// omitted MongoClient usage
}
}
}
创建客户端函数:
export function createClient(url, service)
{
const client = new Proxy(
{},
{
get: (target, property, receiver) => async (...params) => fetch(url, { headers: new Headers({ "Content-Type": "application/json" }), method: "POST", body: JSON.stringify({ id: 0, service: service, method: property, parameters: params }) })
}
);
return client;
}
我尝试在我的 Webpack 配置中使用 webpack.IgnorePlugin(/mongodb/)
,但它确实不包含 MongoDB,但随后捆绑失败并出现 "MongoDB module not found" 错误,即使它没有被使用全部.
如果有人有任何其他建议,我们将不胜感激。谢谢。
编辑:我正在使用最新的 Webpack 2 beta 并在我的 babel 配置中保留 ES6 模块。
if
条件下的显式要求应该有效
import { injectable } from "inversify";
@injectable()
export class TestService
{
public async retrieveTestMessage()
{
if (DEPLOYMENT_NODE == true)
{
const { MongoClient } = require("mongodb");
// omitted MongoClient usage
}
}
}