@build-script/typescript-transformer-dual-package
TypeScript icon, indicating that this package has built-in type declarations

2.0.4 • Public • Published

中 文

What is this

This is a ttypescript transformer:

  • Transpile each source files again after it's normal emit. And create commonjs files, next to esm versions, with .cjs extension.
  • append .js after every top-level imports (dynamic ones currently not support)
  • convert import.meta.url to "file://" + __filename in .cjs files
  • convert import ... from "commonjs-library" to import x from "commonjs-library"; const ... = x; in .js files

Usage

Method A: heft

  1. Install @rushstack/heft, see it's documents
  2. set "emitCjsExtensionForCommonJS": true, in config/typescript.json
  3. Add the transformer to your tsconfig.json:
    {
    	"compilerOptions": {
    		"module": "esnext", // highly recommend
    		"plugins": [
    			{
    				"transform": "@build-script/typescript-transformer-dual-package"
    				// "cjs": ".cjs",
    				// "mjs": ".js"
    				// "verbose": true
    			}
    		]
    	}
    }

Method B: ttypescript

  1. Install typescript, ttypescript, and this transformer
    npm install --save-dev typescript ttypescript @build-script/typescript-transformer-dual-package
  2. Add the transformer to your tsconfig.json:
    {
    	"compilerOptions": {
    		"module": "esnext", // this is required (maybe lower version, but commonjs/system etc is not valid)
    		// ... other options
    		"plugins": [
    			{
    				"transform": " @build-script/typescript-transformer-dual-package",
    				// "compilerOptions": {
    				// [optional]
    				// normally you do not need to set this.
    				//... override parent compilerOptions when compile commonjs
    				// some options can not override
    				// },
    				"verbose": false // [optional] print debug output
    			}
    		]
    	}
    }
  3. Write typescript as you want. But:
    • Do not use any require in your code!, await import() instead (this rule not including module::createRequire)
    • Do not add \.(c|m)?js at end of import statement. (bad: import "./some-file.js")
  4. Compile with ttsc, instead of tsc (package tools like webpack also support ttypescript, please refer to their docs)
    npm install ttypescript
    ttsc -p path/to/tsconfig.json
  5. Update your package.json like that:
    {
    	"type": "module",
    	"main": "lib/api.cjs",
    	"module": "lib/api.js",
    	// maybe "esnext", "browser" etc
    	"bin": {
    		"some-cli-command": "lib/bin.cjs"
    	},
    	"exports": {
    		".": {
    			"require": "lib/api.cjs",
    			"import": "lib/api.js"
    		}
    	}
    }

Related pages:

How

  1. tsc/ttsc run
    1. Load my package
    2. Create Program, setup all transformers, including this one
  2. When Program emit, for each output file, my transformer run:
    1. Modify all ImportDeclaration and ExportDeclaration, add .js to them
    2. Create another Program
      • it will compile emitted file Again, with new compilerOptions, which "module" is "commonjs"
      • add .cjs to all ImportDeclaration and ExportDeclaration

Package Sidebar

Install

npm i @build-script/typescript-transformer-dual-package

Weekly Downloads

2

Version

2.0.4

License

MIT

Unpacked Size

60 kB

Total Files

27

Last publish

Collaborators

  • gongt