Package adding support for custom TypeScript transformers configured in tsconfig.json with ttypescript format.
npm install ng-custom-transformers"@ngtools/webpack": ">=12.0.0". Which is generally Angular 12 and higher.
npm i ng-custom-transformers -D
tsconfig.json. Format is the same like one defined by ttypescript, but don't use ttypescript, Angular has own pipeline for
json5
{
"compilerOptions": {
// ... your options ...
// ADD THIS SECTION!
"plugins": [
{
"transform": "tst-reflect-transformer"
},
// use transformer you want
]
}
}
`
Currently, only transform property is supported, which is a transformer package name or path to a transformer. Other options defined by ttypescript are not implemented
yet. Feel free to create PR!
2. Create file mod.webpack.config.js.
-
`javascript
const {AngularCustomTransformers} = require("ng-custom-transformers");
module.exports = (config, options, targetOptions) => {
// Your transformations of "config" ....
// And the important part here: modifyConfig()
return AngularCustomTransformers.modifyConfig(config);
};
`
or .ts
`typescript
import { AngularCustomTransformers } from "ng-custom-transformers";
import {
CustomWebpackBrowserSchema,
TargetOptions
} from "@angular-builders/custom-webpack";
import * as webpack from "webpack";
export default function (
config: webpack.Configuration,
options: CustomWebpackBrowserSchema,
targetOptions: TargetOptions
)
{
// Your transformations of "config"...
// And the important part here: modifyConfig()
return AngularCustomTransformers.modifyConfig(config);
}
`
3. Modify angular.json.
-
`json5
{
"architect": {
// ...
"build": {
"builder": "@angular-builders/custom-webpack:browser",
// use @angular-builders/custom-webpack builder
"options": {
"customWebpackConfig": {
"path": "./mod.webpack.config.js"
}
// ...
}
}
}
}
`
4. ng build or ng serve
$3
1. ng add ngx-build-plus
2. ng build --plugin ng-custom-transformers or ng serve --plugin ng-custom-transformers`