1 | # Typescript transform paths plugin
|
2 |
|
3 | Heavily tested and most complete import/require path rewriter for typescript.
|
4 |
|
5 | tsconfig baseUrl + paths alias rewriting in bundles and declaration files. You can use absolute paths in libraries. All them will be rewritted to relative in transpiled js and in d.ts files.
|
6 |
|
7 | Works everywhere, no more [tspath](https://github.com/duffman/tspath), [rollup-plugin-alias](https://github.com/rollup/rollup-plugin-alias) or [webpack resolve alias](https://webpack.js.org/configuration/resolve/#resolvealias) and other workarounds.
|
8 |
|
9 | Why? Problem described [here](https://github.com/Microsoft/TypeScript/issues/23701): d.ts files not working, if absolute paths used in npm-packaged library.
|
10 |
|
11 | ## Similar libraries
|
12 |
|
13 | [ts-transform-import-path-rewrite](https://github.com/dropbox/ts-transform-import-path-rewrite) does't support compilerOptions.paths config, doesn't support require function, weak tested.
|
14 |
|
15 | [ts-transformer-imports](https://github.com/grrowl/ts-transformer-imports) doesn't support dynamic import and require function. It doesn't support d.ts: `"transform": "ts-transformer-imports", "afterDeclarations" true, "before": "true"}` rewrites paths only in d.ts, `"transform": "ts-transformer-imports", "afterDeclarations" true, "after": "true"}` rewrites paths only in js.
|
16 |
|
17 | ## External packages
|
18 |
|
19 | Since 1.7.4 plugin rewrites paths only in internal project files, not for packages in node_modules.
|
20 |
|
21 | ```ts
|
22 | // tsconfig.json
|
23 | {
|
24 | "compilerOptions": {
|
25 | "baseUrl": "src"
|
26 | "plugins": [{ "transform": "@zerollup/ts-transform-paths" }],
|
27 | "paths": { "*": ["*"] },
|
28 | }
|
29 | }
|
30 |
|
31 | // main.ts
|
32 | import { app } from "electron"; // a module in node_modules
|
33 | import { setMenu } from "main/menu"; // a module in the current dir
|
34 |
|
35 | // main.js
|
36 | const electron_1 = require("electron");
|
37 | const menu_1 = require("./main/menu");
|
38 | ```
|
39 |
|
40 | ## Setup For [ttypescript](https://github.com/cevek/ttypescript)
|
41 |
|
42 | [ttypescript](https://github.com/cevek/ttypescript) is a wrapper around typescript with transformer plugin support in tsconfig.json.
|
43 |
|
44 | my-lib/tsconfig.json:
|
45 |
|
46 | ```json
|
47 | {
|
48 | "compilerOptions": {
|
49 | "baseUrl": ".",
|
50 | "paths": {
|
51 | "my-lib/*": ["src/*"]
|
52 | },
|
53 | "plugins": [
|
54 | {
|
55 | "transform": "@zerollup/ts-transform-paths",
|
56 | "exclude": ["*"]
|
57 | }
|
58 | ]
|
59 | }
|
60 | }
|
61 | ```
|
62 |
|
63 | my-lib/src/index.ts
|
64 | ```ts
|
65 | export * from 'my-lib/some'
|
66 | ```
|
67 |
|
68 | my-lib/src/some.ts
|
69 | ```ts
|
70 | export const some = '123'
|
71 | ```
|
72 |
|
73 | Transpiled my-lib/dist/index.js
|
74 |
|
75 | ```ts
|
76 | export * from './some'
|
77 | ```
|
78 |
|
79 | Typings my-lib/dist/index.d.ts
|
80 |
|
81 | ```ts
|
82 | export * from './some';
|
83 | ```
|
84 |
|
85 | For more examples see [zerollup demo lib](https://github.com/zerkalica/zerollup-demo/tree/master/packages/lib1).
|
86 |
|
87 | ## Setup For [rollup-plugin-typescript2](https://github.com/ezolenko/rollup-plugin-typescript2)
|
88 |
|
89 | install:
|
90 | ```shell
|
91 | $ npm i -D @zerollup/ts-transform-paths ttypescript
|
92 | ```
|
93 |
|
94 | add to configure file rollup.config.js
|
95 | ```js
|
96 | import ttypescript from 'ttypescript'
|
97 | import tsPlugin from 'rollup-plugin-typescript2'
|
98 |
|
99 | export default {
|
100 | input: 'src/lib.ts',
|
101 | output: [{ file : 'dist/lib.js', name : 'mylib', format : 'iife', sourcemap : true }],
|
102 | plugins: [
|
103 | tsPlugin({
|
104 | typescript: ttypescript
|
105 | })
|
106 | ]
|
107 | }
|
108 | ```
|
109 |
|
110 | And setup tsconfig.json
|
111 |
|
112 | ```json
|
113 | {
|
114 | "compilerOptions": {
|
115 | "baseUrl": ".",
|
116 | "paths": {
|
117 | "my-lib/*": ["src/*"]
|
118 | },
|
119 | "plugins": [
|
120 | {
|
121 | "transform": "@zerollup/ts-transform-paths",
|
122 | "exclude": ["*"]
|
123 | }
|
124 | ]
|
125 | }
|
126 | }
|
127 | ```
|
128 |
|
129 | ## Setup For webpack [ts-loader](https://github.com/TypeStrong/ts-loader)
|
130 |
|
131 | ```js
|
132 | const tsTransformPaths = require('@zerollup/ts-transform-paths');
|
133 |
|
134 | module.exports = {
|
135 | module: {
|
136 | rules: [
|
137 | {
|
138 | test: /\.(ts|tsx)$/,
|
139 | loader: 'ts-loader',
|
140 | options: {
|
141 | getCustomTransformers: (program) => {
|
142 | const transformer = tsTransformPaths(program);
|
143 |
|
144 | return {
|
145 | before: [transformer.before], // for updating paths in generated code
|
146 | afterDeclarations: [transformer.afterDeclarations] // for updating paths in declaration files
|
147 | };
|
148 | }
|
149 | }
|
150 | }
|
151 | ]
|
152 | }
|
153 | };
|
154 | ```
|
155 |
|
156 | ## Plugin options
|
157 |
|
158 | ```ts
|
159 | interface Config {
|
160 | /**
|
161 | Disable plugin path resolving for given paths keys
|
162 | */
|
163 | exclude?: string[] | void
|
164 | }
|
165 | ```
|