如何仅为TypeScript项目的一部分生成和捆绑.d.ts?

时间:2019-01-24 01:06:59

标签: javascript typescript webpack

我想

仅为TypeScript项目的一部分生成并捆绑.d.ts。 预期结果如下。

out
┣ bundle.js // Transpile and bundle all code from Project.
┗ bundle.d.ts // definition only selected function/class.

用途:用于npm软件包。我想给软件包用户仅可运行的JS文件和接口定义。

构建目标的文件夹结构。

src
┣ main.ts // import sub1, sub2.
┣ sub
┃  ┣ sub1.ts // I want to generate functions/class from part of this file.
┃  ┗ sub2.ts // Do not want to generate definition from this file. (but this file has some export.)
┣ tsconfig.json // `"declaration": true`, generate from whole project.
┗ webpack.config.js // bundle js, but not bundle d.ts.

配置文件

webpack.config.js

module.exports = {
    mode: "production",
    entry: {
        index: "./src/main.ts"
    },
    output: {
        filename: "[name].js",
        path: __dirname + "/out"
    },

    resolve: {
        // Add '.ts' and '.tsx' as resolvable extensions.
        extensions: [".ts", ".js", ".json"],
    },

    module: {
        rules: [
            {
                test: /\.ts$/,
                exclude: /node_modules|vue\/src/,
                use: [
                    {
                        loader: 'ts-loader',
                        options: {
                            appendTsSuffixTo: [/\.vue$/]
                        }
                    }],
            }
        ]
    },
};

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    "declaration": true,                   /* Generates corresponding '.d.ts' file. */
    "sourceMap": true,                     /* Generates corresponding '.map' file. */
    "outDir": "./out/",                        /* Redirect output structure to the directory. */
    "rootDir": "./src/",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
    "strict": true,                           /* Enable all strict type-checking options. */
    "esModuleInterop": true                   /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
  }
}

版本

  • tsc:版本3.2.4
  • webpack:版本4.29.0

0 个答案:

没有答案