简体   繁体   English

TSC/Rollup:如何在没有 TSC 发出文件的情况下将 pipe TSC output 放入 Rollup?

[英]TSC/Rollup: how to pipe TSC output into Rollup without TSC emitting files?

I'm using rollup with TSC to generate es modules based bundle.我正在使用带有 TSC 的汇总来生成基于 es 模块的包。 When I run npm run build tsc transpiles .ts to .js files inside src .当我运行npm run build tsc 将.ts转换为src中的.js文件。 After that, Rollup takes the .js files and does some magic like turning bare module imports into relative imports to make it browser compatible and outputs it into dist folder.之后,Rollup 获取.js文件并执行一些魔术,例如将bare module imports转换为relative imports以使其与浏览器兼容并将其输出到dist文件夹。

Now the question is: How can you "give" the output of TSC's js files to Rollup without emitting them to the src folder?现在的问题是:如何将 TSC 的js文件的 output “给”到 Rollup 而不将它们发送到 src 文件夹?

I know about the noEmit tsconfig option but then I have no js files to give to Rollup.我知道noEmit tsconfig 选项,但是我没有js文件可以提供给 Rollup。

I'm using TSC because Babel gave me problems with decorators.我使用 TSC 是因为 Babel 给了我装饰器的问题。

This is the command:这是命令:

在此处输入图像描述

This is the folder structure.这是文件夹结构。 As you can see inside src folder every .ts file has it .js file which is redundant and is clutter in the src folder.正如您在src文件夹中看到的那样,每个.ts文件都有.js文件,这是多余的,并且在src文件夹中很混乱。 Would be nice to have them not saved there and just used as input for rollup.最好不要将它们保存在那里并仅用作汇总的输入。

在此处输入图像描述

Rollup config汇总配置

import html from "@web/rollup-plugin-html";
import { nodeResolve } from "@rollup/plugin-node-resolve";
import copy from "rollup-plugin-copy";

export default {
  input: "src/index.html",
  output: { dir: "dist", format: "es", preserveModules: true },
  plugins: [
    html(),
    nodeResolve(),
    copy({
      targets: [{ src: "src/manifest.json", dest: "dist" }],
    }),
  ],
};

tsconfig.json tsconfig.json

{
  "compilerOptions": {
    "incremental": true /* Enable incremental compilation */,
    "target": "es2019" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
    "lib": [
      "ES2019",
      "DOM"
    ] /* Specify a set of bundled library declaration files that describe the target runtime environment. */,
    "experimentalDecorators": true /* Enable experimental support for TC39 stage 2 draft decorators. */,
    "module": "ESNEXT" /* Specify what module code is generated. */,
    "moduleResolution": "node" /* Specify how TypeScript looks up a file from a given module specifier. */,
    "rootDirs": [
      "src"
    ] /* Allow multiple folders to be treated as one when resolving modules. */,

    "importHelpers": true /* Allow importing helper functions from tslib once per project, instead of including them per-file. */,
    "noEmitOnError": true /* Disable emitting files if any type checking errors are reported. */,

    "isolatedModules": true /* Ensure that each file can be safely transpiled without relying on other imports. */,
    "allowSyntheticDefaultImports": true /* Allow 'import x from y' when a module doesn't have a default export. */,
    "esModuleInterop": false /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */,
    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,

  
    "strict": true ,
    "skipLibCheck": true ,
    "pretty": true
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

my solution was to output tsc emitted files into tsc-out folder inside the src folder and delete it after with pre- and post- npm scripts.我的解决方案是 output tsc 将文件发送到 src 文件夹内的tsc-out文件夹中,并在使用 npm 脚本之前和之后将其删除。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM