是否可以在子文件夹中运行打字稿编译器？

Posted 2023-02-16

【中文标题】是否可以在子文件夹中运行打字稿编译器？

【英文标题】：Is it possible to run he typescript compiler in a child folder?

【发布时间】：2020-04-15 10:00:07

【问题描述】：

我有一个文件结构如下的项目

builds
-dev
--public
--private
-production
--public
--private

src
-server
-client

tsconfig
package.json 

我正在使用 parcel-bundler 来编译和捆绑客户端文件夹。我想使用 typescript 编译器或 tsc 来编译节点 js 服务器文件夹。是否可以从特定目录运行 tsc？

  "scripts": 
    "dev": "tsc (directory name goes here so the server directory) && parcel ./src/client/index.html --open --out-dir ./builds/development/public"
  

根 tsconfig

 
      "compilerOptions": 
        /* Basic Options */
        "target": "ES5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
        "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
        "lib": ["DOM", "ES2018"],                             /* Specify library files to be included in the compilation. */
        "allowJs": false,                       /* Allow javascript files to be compiled. */
        "checkJs": false,                       /* Report errors in .js files. */
        "sourceMap": true,                     /* Generates corresponding '.map' file. */
        "removeComments": true,                /* Do not emit comments to output. */
        "noEmit": true,                        /* Do not emit outputs. */
        "declaration": true,

        /* Strict Type-Checking Options */
        "strict": true,                           /* Enable all strict type-checking options. */
        "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
        "strictNullChecks": true,              /* Enable strict null checks. */
        "strictFunctionTypes": true,           /* Enable strict checking of function types. */
        "strictBindCallApply": true,           /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
        "strictPropertyInitialization": true,  /* Enable strict checking of property initialization in classes. */
        "noImplicitThis": true,                /* Raise error on 'this' expressions with an implied 'any' type. */
        "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */

        /* Additional Checks */
        "noUnusedLocals": true,                /* Report errors on unused locals. */
        "noUnusedParameters": true,            /* Report errors on unused parameters. */
        "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
        "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */

        /* Module Resolution Options */
        "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
        // "paths": 
        //   "~*": ["./*"]
        // ,
        "typeRoots": ["node_modules/@types"],                       /* List of folders to include type definitions from. */
        "esModuleInterop": true,                  /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
        "forceConsistentCasingInFileNames": true,  /* Disallow inconsistently-cased references to the same file. */
        "experimentalDecorators": true
      
    

服务器 tsconfig

    "extends": "../../tsconfig",
    "compilerOptions": 
        "outDir": "../../builds/development/private",
        "rootDir": "."
    

【问题讨论】：

检查compiler options 我认为-p 是你需要的

这确实编译了整个服务项目，但它仍然不会在正确的 outDir 中输出它，知道为什么会这样吗？

输出到哪里？

【参考方案1】：

我最终用 Parcel 做机器人并同时运行它们

"dev": "concurrently --kill-others \"npm run watch-client\" \"npm run watch-server\" \"npm run serve\"",
"watch-client": "parcel ./src/client/index.html --open --out-dir ./builds/development/public",
"watch-server": "parcel ./src/server/index.ts --out-dir ./builds/development/private --target node",
"serve": "nodemon ./builds/development/private/index.js",

【参考方案2】：

创建一个扩展您的根 tsconfig 的 tsconfig，并将其放在您要构建的文件夹中。在该 tsconfig 中包含该文件夹内的文件。然后在脚本中指定 tsconfig。

具体的tsconfig.json 应该是这样的：

  "extends": "../../tsconfig.json",
  "compilerOptions": 
    "outDir": "../../builds/development/private",
    "noEmit": false
  ,
  "include": [
    "./**/*.ts"
  ],
  "exclude": [
    "./**/*.spec.ts"
  ]

【讨论】：

它可以工作，但它忽略了服务器文件夹中 tsconfig 的输出目录，该目录扩展了根目录中的 tsconig。 "outDir": "../../builds/development/private" 它只是将 js 文件放在服务器文件夹中，为什么会发生瘦？我将配置添加到问题中

这很奇怪。我用一个 tsconfig 的例子更新了我的答案。这对我有用（区别在于包含部分和没有“noEmit”）。此外，扩展的完整文件名。