创建跨项目通用TypeScript库时的Webpack构建报错求助

1. 修正代码中的namespace导出 #

首先，Platform命名空间必须显式导出，同时内部类也要导出，否则TypeScript会判定没有对外暴露的内容，触发“emitted no output”错误。

修改核心代码：

// src/index.ts
export namespace Platform {
  // 导出内部类，外部才能访问
  export class Core {
    constructor() {
      // 业务逻辑
    }
  }

  export class Utils {
    static formatData(data: any) {
      // 工具方法逻辑
    }
  }
}

2. 调整tsconfig.json配置 #

确保TypeScript编译配置能正确生成JS文件和声明文件：

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "declaration": true,
    "outDir": "./dist",
    "emitDeclarationOnly": false,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "strict": true,
    "moduleResolution": "Node"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

关键配置说明：

• declaration: true：强制生成.d.ts声明文件
• emitDeclarationOnly: false：同时生成JS文件和声明文件（避免只生成声明）
• module: "ESNext"：与Webpack的模块处理逻辑兼容
• include：指定需要编译的源码目录范围

3. 修正Webpack配置 #

调整Webpack输出为UMD格式，确保模块能兼容CommonJS、AMD和浏览器全局环境：

const path = require('path');

module.exports = {
  entry: './src/index.ts',
  mode: 'production',
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/,
        options: {
          configFile: './tsconfig.json'
        }
      }
    ]
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.js'],
  },
  output: {
    filename: 'platform.min.js',
    path: path.resolve(__dirname, 'dist'),
    // 配置UMD格式，兼容多模块规范
    library: {
      name: 'Platform',
      type: 'umd',
      export: 'Platform'
    },
    clean: true, // 每次构建清空dist目录
  },
};

4. 配置package.json #

确保其他项目能正确识别模块和声明文件：

{
  "name": "your-platform-package",
  "version": "1.0.0",
  "main": "./dist/platform.min.js",
  "types": "./dist/index.d.ts",
  "scripts": {
    "build": "webpack",
    "build:types": "tsc --emitDeclarationOnly"
  },
  "files": [
    "dist/**/*"
  ]
}

• main：指定CommonJS规范的入口文件
• types：指定声明文件路径，让TS项目自动识别类型
• files：明确发布时需要包含的文件目录

5. 验证导入方式 #

其他项目安装你的包后，可通过以下方式正常导入：

// ES模块
import { Platform } from 'your-platform-package';
const coreInstance = new Platform.Core();

// CommonJS
const { Platform } = require('your-platform-package');

// 浏览器全局环境
const coreInstance = new window.Platform.Core();

问题根源说明 #

• “TypeScript emitted no output”：未导出的命名空间属于内部代码，TypeScript不会生成任何输出，必须用export将其暴露为模块的一部分。
• export default无法识别：直接export default Platform会导致部分模块加载器解析异常，UMD格式+命名导出的兼容性更强，同时声明文件也能正确关联类型。

内容的提问来源于stack exchange，提问作者naknik