简体   繁体   中英

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. When I run npm run build tsc transpiles .ts to .js files inside src . 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.

Now the question is: How can you "give" the output of TSC's js files to Rollup without emitting them to the src folder?

I know about the noEmit tsconfig option but then I have no js files to give to Rollup.

I'm using TSC because Babel gave me problems with decorators.

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. 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

{
  "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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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