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.