一个库文件的Webpack/Typescript，如何进行树摇导入，但不进行树摇导出

Question

我对这一切有点陌生，所以我可能用错了webpack。

我们的要求：我有一个文件，其中包含需要在typescript/javascript文件中引用的对象。这个文件是巨大的，这就是为什么我想把它树摇到只使用特定的属性。这个文件看起来像这样：

export const Fieldnames = {
testObject: {
"testfield1":"testfield1",
"testfield2":"testfield2",
"testfield3":"testfield3",
"testfield4":"testfield4",
"testfield5":"testfield5",
"testfield6":"testfield6",
},
}

然后，我想创建几个库文件，这些文件公开(导出？(javascript函数，这样我就可以将这些文件上传到网站，网站就可以独立地调用这些函数。这一点有点重要：VisualStudioCode/Webpack不知道我需要这些巧妙的、公开的函数，只是对那些没有立即调用的函数进行树摇。我的TS文件如下所示：

这是TS源文件：

import {Fieldnames} from "../Earlybound/FieldnamesTest";
export function testFunctionNeverCalled() {
console.log(`never called survived. ${Fieldnames.testObject.testfield1}`);
}
export function testFunctionCalled () {
console.log(`Called survived. ${Fieldnames.testObject.testfield3}`);
}
testFunctionCalled();

结果是：

( () => {
"use strict";
console.log("Called survived. testfield3")
})();

这里的问题是；testFunctionNeverCalled"；已经消失。测试对象和测试字段已经按照我希望的方式进行了集成

我的webpack.config.js看起来像这样：

const path = require('path');
module.exports = {
entry: {
inputfile1: './src/inputfile1.ts',
},
mode: "production",
module: {
rules: [
{
test: /.ts$/,
use: 'ts-loader',
include: [path.resolve(__dirname,'src')]
},
]
},
output: {
filename: '[name].js',
path: path.resolve(__dirname,"../JavascriptOutput/")
},
resolve: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
},
optimization: {
mangleExports: true,
usedExports:true,
}
}

我不应该在这里使用webpack吗？有其他选择吗？我非常感谢您的意见。谢谢

Answer 1

我最终发现的一种可能性是将所有内容输出到这样的库中：

module.exports = {
entry: {
wscrm_vehicle: './src/wscrm_vehicle.ts',
wscrm_vehicle2: './src/wscrm_vehicle2.ts',
lead: './src/lead.ts'
},
output: {
path: path.resolve(__dirname,"../JavascriptOutput/"),
filename: '[name].js',
libraryTarget: 'var',
library: 'functions'
},

这给了我以下的输出，即

var functions;
(() => {
"use strict";
var e = {
d: (t, o) => {
for (var n in o) e.o(o, n) && !e.o(t, n) && Object.defineProperty(t, n, {
enumerable: !0,
get: o[n]
})
},
o: (e, t) => Object.prototype.hasOwnProperty.call(e, t),
r: e => {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {
value: "Module"
}), Object.defineProperty(e, "__esModule", {
value: !0
})
}
},
t = {};
e.r(t), e.d(t, {
testFunctionCalled: () => r,
testFunctionNeverCalled: () => l
});
const o = "testfield1",
n = "testfield3";
function l() {
console.log("never called survived. " + o)
}
function r() {
console.log("Called survived. " + n)
}
r(), functions = t
})();

效果出奇的好！