Transform import paths in typescript compile result.
For example, transform less
import sentences to css
:
From
import './index.less'
export default () => <div className='hello' />
to
import './index.css'
export default () => <div className='hello' />
This plugin can be used programmatically, or by using as a tsconfig.json plugin (requires ttypescript).
To use this plugin in tsconfig.json, add the following config:
{
"compilerOptions": {
"plugins": [
{
"transform": "ts-rename-import-plugin",
"type": "config",
"from": "\\.less$",
"to": ".css"
},
]
}
}
Then use ttypescript instead of typescript:
npm i -D ttypescript ts-rename-import-plugin
ttsc # instead of tsc
Check out ttypescript for more info.
import tsImportRenamePlugin from "./";
import * as ts from "typescript";
const transform = (source: string) => {
return ts.transpileModule(source, {
compilerOptions: {
module: ts.ModuleKind.CommonJS,
target: ts.ScriptTarget.ESNext,
jsx: ts.JsxEmit.React
// ... other options
},
transformers: {
before: [
tsImportRenamePlugin({
transformer: name => name.replace(/\.less$/, '.css')
})
/** or
tsImportRenamePlugin({
from: '\\.less$',
to: '.css'
})
*/
]
}
}).outputText;
}
});