Javascript 设置用于NodeJ、浏览器和其他typescript项目的typescript库

我正在编写一个需要在nodejs和浏览器中运行的库（通过脚本标记导入）。
我想用typescript来写它，因为它很方便，我也想用webpack，因为在某个时候我可能会有其他的内容或样式与之关联。
到目前为止，我已经成功地将库提供给node和浏览器，但不知何故，我不能简单地将它导入另一个typescript项目并使用它是一个typescript库的事实

这就是我的

tsconfig.json

的外观：

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": true,
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "target": "es6",
    "outDir": "ts/",
    "strict": true
  }
}

这是我的

webpack.config.js

：

const path = require('path');

// PLATFORMS
var variants = [
  {
    target: "web",
    filename: "index.browser.js"
  },
  {
    target: "node",
    filename: "index.node.js"
  },
];

// CONFIG
var configGenerator = function (target, filename) {
  return {
    entry: './src/index.ts',
    module: {
      rules: [
        {
          test: /\.tsx?$/,
          use: 'ts-loader',
          exclude: /node_modules/
        }
      ]
    },
    resolve: {
      extensions: [ '.tsx', '.ts', '.js' ]
    },
    target: target, // "web" is default
    output: {
      library: "myWebpackTypescriptLib",
      libraryTarget: "umd",
      filename: filename,
      path: path.resolve(__dirname, 'dist')
    }
  };
};

// MAP PLATFORMS WITH CONFIGS
module.exports = variants.map(function(variant){
  return configGenerator(variant.target, variant.filename)
})

从另一个typescript项目中，我尝试按如下方式导入它：

import myWebpackTypescriptLib from "myWebpackTypescriptLib";

// UTILITIES
export * from "./utilities/someUtility";

// ADDITIONALS
export { someModule } from "./additionals/someModule";

let test = 10;
let echo = (a:any) => {
  return a;
}

export default test;
export { echo };

但是，在我的文本编辑器中，通过此导入，我将无法访问typescript定义，并且在运行时我遇到以下错误：

ReferenceError:require未定义

我也尝试了以下几点，希望能有更好的结果：

import * as myWebpackTypescriptLib from "myWebpackTypescriptLib/src/index"
import * as myWebpackTypescriptLib from "myWebpackTypescriptLib/dist/ts/index.d"

有了这些，我成功地获得了typescript定义，但没有运行代码

我在编译器中尝试了不同的模块和目标配置，但不知怎的，现在的配置给了我最好的结果。我要做的事情中至少有三件是两件。
关于如何实现类似的目标，我已经学习了很多不同的教程，但我从来没有让这三个要素发挥作用。我一定还是错过了什么。
有什么想法吗

编辑：
我的目录结构是这样的：

所有代码都位于“/src/”目录中，webpack为“/dist/”中的浏览器和节点创建版本
文件/src/index.ts从其他文件、插件、实用程序中导入代码，如下所示：

import myWebpackTypescriptLib from "myWebpackTypescriptLib";

// UTILITIES
export * from "./utilities/someUtility";

// ADDITIONALS
export { someModule } from "./additionals/someModule";

let test = 10;
let echo = (a:any) => {
  return a;
}

export default test;
export { echo };

---

所有导入和导出都已正确设置，因为webpack为浏览器和节点提供了良好的渲染效果。

因此我最终成功地使其正常工作。
我在库的

package.json

中缺少正确的类型声明，这就是它现在的样子，它的工作原理：）

{
“名称”：“MyWebPackageTypeScriptLib”，
“版本”：“0.0.1”，
“说明”：“一个网页包类型脚本库，可用于浏览器、节点和其他类型脚本项目。”，
“main”：“dist/index.node.js”，
“类型”：“dist/ts/index.d.ts”，//要使用的
导入
类型取决于程序包的功能是如何导出的。您应该用示例更新您的问题，说明您是如何做到这一点的。例如，
导出默认值
将允许您第一次尝试工作。但是。@Danielarwicker感谢您的评论。我认为问题不必解决o使用
import
或
export
时，我认为这方面的设置都是正确的，特别是因为webpack在为浏览器和节点生成输出时没有任何问题。问题似乎更多地出现在整个库的设置中，但我还不太明白它在哪里。