Question

我有一个打字稿项目，当我开发它时，代码会在许多文件中传播。

我想将该项目分发为单个js和d.ts文件 - 最好的方法是什么？

Answer 1

打包文件时，通常无需将其合并到单个文件中。使用软件包管理器（例如NPM），您的文件将捆绑到一个软件包中，您可以将其保密或公开，并且该软件包包含运行模块所需的所有文件。

特别是使用TypeScript，您可以打包.js和.d.ts文件，这意味着您的软件包将适用于TypeScript和JavaScript使用者。您不会将.ts文件添加到包中。

如果您同时定位浏览器和节点环境，则可以使用UMD模块，这些模块适用于两种环境。

实际示例 - TypeSpec。

请注意 - 我已将整个文件放在下面以确保上下文存在，但重要的位通常是一行或两行，我已经突出显示。

TypeScript配置文件 - 重要的位是＆＃34;模块＆＃34;善意，并且发出声明＆＃34;文件。

{
  "compileOnSave": true,
  "compilerOptions": {
    "target": "ES5",
    "module": "umd", // <--
    "strict": true,
    "experimentalDecorators": true,
    "noEmitOnError": false,
    "noFallthroughCasesInSwitch": true,
    "noImplicitReturns": true,
    "sourceMap": true,
    "removeComments": false,
    "declaration": true, // <--
    "downlevelIteration": true,
    "noUnusedLocals": true,
    "noUnusedParameters": false
  }
}

Gulp文件 - 这会将文件移动到dist文件夹中，包含package.json和readme文件，但最重要的是所有JavaScript和类型定义。

var gulp = require('gulp');

gulp.task('default', function () {
    gulp.src('./node_modules/requirejs/require.js')
        .pipe(gulp.dest('./lib'));

    // This bit moves type definitions
    gulp.src('./Scripts/TypeSpec/*.d.ts')
        .pipe(gulp.dest('./dist/src'));

    // And this bit moves the JavaScript
    gulp.src('./Scripts/TypeSpec/*.js')
        .pipe(gulp.dest('./dist/src'));

    gulp.src('../README.md')
        .pipe(gulp.dest('./dist'));

    gulp.src('./package.json')
        .pipe(gulp.dest('./dist'));
});

package.json文件提示主要源文件和类型信息可以在＆＃34; main＆＃34;中找到。和＆＃34;类型＆＃34;部分：

{
  "author": "Steve Fenton",
  "name": "typespec-bdd",
  "description": "BDD framework for TypeScript.",
  "keywords": [
    "typespec",
    "typescript",
    "bdd",
    "behaviour",
    "driven"
  ],
  "version": "0.7.1",
  "homepage": "https://github.com/Steve-Fenton/TypeSpec",
  "bugs": "https://github.com/Steve-Fenton/TypeSpec/issues",
  "license": "(Apache-2.0)",
  "files": [
    "src/"
  ],
  "repository": {
    "url": "https://github.com/Steve-Fenton/TypeSpec"
  },
  "main": "./src/TypeSpec.js", <-- main file
  "types": "./src/TypeSpec.d.ts", <-- type information starts here
  "dependencies": {},
  "devDependencies": {
    "gulp": "^3.9.1",
    "requirejs": "^2.3.5"
  },
  "optionalDependencies": {},
  "engines": {
    "node": "*"
  }
}

你现在有一个＆＃34; dist＆＃34;只包含您需要打包的文件的文件夹。您可以在不使用。

发布到NPM的情况下进行试用

npm pack

构建和分发Typescript项目

1 个答案: