What is rollup-plugin-typescript2?
rollup-plugin-typescript2 is a Rollup plugin that integrates TypeScript compilation into the Rollup bundling process. It provides advanced TypeScript features, incremental compilation, and better error reporting compared to other TypeScript plugins for Rollup.
What are rollup-plugin-typescript2's main functionalities?
TypeScript Compilation
This feature allows you to compile TypeScript files into JavaScript as part of the Rollup bundling process. The plugin reads the tsconfig.json file for TypeScript configuration.
const typescript = require('rollup-plugin-typescript2');
module.exports = {
input: 'src/main.ts',
output: {
file: 'bundle.js',
format: 'cjs'
},
plugins: [
typescript({
tsconfig: 'tsconfig.json'
})
]
};
Incremental Compilation
This feature enables incremental compilation, which speeds up the build process by only recompiling files that have changed since the last build.
const typescript = require('rollup-plugin-typescript2');
module.exports = {
input: 'src/main.ts',
output: {
file: 'bundle.js',
format: 'cjs'
},
plugins: [
typescript({
tsconfig: 'tsconfig.json',
useTsconfigDeclarationDir: true
})
]
};
Error Reporting
This feature provides enhanced error reporting, making it easier to debug TypeScript compilation issues. The 'clean' option ensures that the cache is cleared before each build, which can help in identifying persistent errors.
const typescript = require('rollup-plugin-typescript2');
module.exports = {
input: 'src/main.ts',
output: {
file: 'bundle.js',
format: 'cjs'
},
plugins: [
typescript({
tsconfig: 'tsconfig.json',
clean: true
})
]
};
Other packages similar to rollup-plugin-typescript2
rollup-plugin-typescript
rollup-plugin-typescript is another Rollup plugin for integrating TypeScript compilation. It is simpler and has fewer features compared to rollup-plugin-typescript2, lacking incremental compilation and advanced error reporting.
rollup-plugin-sucrase
rollup-plugin-sucrase is a Rollup plugin that uses Sucrase to compile TypeScript and other modern JavaScript syntax. It is faster than rollup-plugin-typescript2 but does not support type checking.
rollup-plugin-babel
rollup-plugin-babel is a Rollup plugin that uses Babel to transpile JavaScript, including TypeScript. It offers a wide range of plugins and presets but requires additional configuration for TypeScript support.
rollup-plugin-typescript2
Rollup plugin for typescript with compiler errors.
This is a rewrite of original rollup-plugin-typescript, starting and borrowing from this fork.
This version is somewhat slower than original, but it will print out typescript syntactic and semantic diagnostic messages (the main reason for using typescript after all).
Usage
import typescript from 'rollup-plugin-typescript2';
export default {
entry: './main.ts',
plugins: [
typescript()
]
}
The plugin inherits all compiler options and file lists from your tsconfig.json
file. If your tsconfig has another name or another relative path from the root directory, see tsconfig
and tsconfigOverride
options below. This also allows for passing in different tsconfig files depending on your build target.
The following compiler options are forced though:
module
: es2015
noEmitHelpers
: trueimportHelpers
: truenoResolve
: falseoutDir
: process.cwd()
declarationDir
: process.cwd()
(only if useTsconfigDeclarationDir
is false in the plugin options)moduleResolution
: node
(classic
is depreciated. It also breaks this plugin, see #12 and #14)
Plugin options
-
tsconfig
: "tsconfig.json"
Override this if your tsconfig has another name or relative location from the project directory.
-
tsconfigOverride
: {}
The object passed as tsconfigOverride
will be merged with loaded tsconfig before parsing. Hard overrides (see above) will be applied on top of that. Theoretically you can put everything you would put in tsconfig proper.
let override = { compilerOptions: { declaration: true } };
plugins: [
typescript({ tsconfigOverride: override })
]
This is a deep merge (objects are merged, arrays are concatenated, primitives are replaced, etc), increase verbosity to 3 and look for parsed tsconfig
if you get something unexpected.
-
check
: true
Set to false to avoid doing any diagnostic checks on the code.
-
verbosity
: 1
- 0 -- Error
- 1 -- Warning
- 2 -- Info
- 3 -- Debug
-
clean
: false
Set to true for clean build (wipes out cache on every build).
-
cacheRoot
: ./.rts2_cache
Path to cache. Defaults to a folder in the current directory. Can be safely moved out with something like ${require('temp-dir')}/.rpt2_cache
, but watch out for multiple concurrent builds of the same repo.
-
include
: [ "*.ts+(|x)", "**/*.ts+(|x)" ]
By default passes all .ts files through typescript compiler.
-
exclude
: [ "*.d.ts", "**/*.d.ts" ]
But excludes type definitions.
-
abortOnError
: true
Bail out on first syntactic or semantic error. In some cases setting this to false will result in exception in rollup itself (for example for unresolvable imports).
-
rollupCommonJSResolveHack
: false
On windows typescript resolver favors POSIX path, while commonjs plugin (and maybe others?) uses native path as module id. This can result in namedExports
being ignored if rollup happened to use typescript's resolution. Set to true to pass resolved module path through resolve()
to match up with rollup-plugin-commonjs
.
-
useTsconfigDeclarationDir
: false
If true, declaration files will be emitted in the directory given in the tsconfig. If false, the declaration files will be placed inside the destination directory given in the Rollup configuration.
-
typescript
: typescript module installed with the plugin
When typescript version installed by the plugin (latest 2.x) is unacceptable, you can import your own typescript module and pass it in as typescript: require("typescript")
. Must be 2.0+, things might break if transpiler interfaces changed enough from what the plugin was built against.
Declarations
This plugin respects declaration: true
in your tsconfig.json
file. When set, it will emit *.d.ts
files for your bundle. The resulting file(s) can then be used with the types
property in your package.json
file as described here.
By default, the declaration files will be located in the same directory as the generated Rollup bundle. If you want to override this behavior and instead use the declarationDir set useTsconfigDeclarationDir
to true
in the plugin options.
Watch mode
The way typescript handles type-only imports and ambient types effectively hides them from rollup watch, because import statements are not generated and changing them doesn't trigger a rebuild.
Otherwise the plugin should work in watch mode. Make sure to run a normal build after watch session to catch any type errors.
Version
This plugin currently requires TypeScript 2.0+
.
Rollup version
Tested on rollup 0.50.0
.
Reporting bugs
Report any bugs on github: https://github.com/ezolenko/rollup-plugin-typescript2/issues.
Attach your tsconfig.json
, package.json
(for versions of dependencies), rollup script and anything else that could influence module resolution, ambient types and typescript compilation.
Check if problem is reproducible after running npm prune
to clear any rogue types from npm_modules (by default typescript grabs all ambient types).
Check if you get the same problem with clean
option set to true (might indicate a bug in the cache).
If makes sense, check if running tsc
directly produces similar results.
Attach plugin output with verbosity
option set to 3 (this will list all files being transpiled and their imports).