https://github.com/perfective/ts.build
Perfective build for TypeScript projects
https://github.com/perfective/ts.build
Last synced: 18 days ago
JSON representation
Perfective build for TypeScript projects
- Host: GitHub
- URL: https://github.com/perfective/ts.build
- Owner: perfective
- License: mit
- Created: 2021-03-28T10:53:55.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2024-03-24T16:06:27.000Z (about 1 year ago)
- Last Synced: 2024-04-26T22:22:23.001Z (12 months ago)
- Language: JavaScript
- Size: 1.36 MB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 11
-
Metadata Files:
- Readme: README.adoc
- Changelog: CHANGELOG.adoc
- License: LICENSE
Awesome Lists containing this project
README
= Perfective Build for TypeScript
The `@perfective/build` package provides base configurations
and presets for tools like Gulp, TypeScript, Babel, etc.
to reduce code duplication between projects setup.
== Installation
[source,bash]
----
npm install --save-dev \
@perfective/build \
typescript
----
== Building a TypeScript project
. Check that dev dependencies include correct versions of `gulp` and `typescript`:
+
[source,json]
----
{
"devDependencies": {
"gulp": "^5.0.0",
"typescript": "~5.8.2"
}
}
----
+
. Setup `tsconfig.json` using the base `tsconfig.strict.json` configuration.
+
[source,json]
----
{
"extends": "@perfective/build/tsconfig.strict.json",
"compilerOptions": {
"rootDir": "./src"
},
"exclude": [
"dist"
]
}
----
+
. Add the `RequireExtension` and `ImportExtension` plugins to your `babel.config.js`.
`RequireExtension` replaces `.js` extensions with the `.cjs` extensions in `require()` statements.
`ImportExtension` adds the required `.mjs` (or `.js`) extension to the `import` and `export` statements for ES modules.
+
[source,javascript]
----
import { babelPluginImportExtension, babelPluginRequireExtension } from '@perfective/build/babel';
export default {
presets: [],
plugins: [
babelPluginRequireExtension,
babelPluginImportExtension('js'), // <.>
]
};
----
<.> Override the default extension (`mjs`).
== Setup Prettier
. Add `prettier` as a dev dependency:
+
[source,json]
----
{
"devDependencies": {
"prettier": "^3.5.2"
}
}
----
+
. Setup `.prettierrc.js`:
+
[source,js]
----
import { config } from '@perfective/build/prettier';
export default config;
----
+
. Setup `.prettierignore`:
+
[source,ignore]
----
# Build
dist
# ESLint
*.js
*.jsx
*.ts
*.tsx
----
+
. Update `package.json` scripts.
+
[source,json]
----
{
"scripts": {
"lint": "npm run lint:prettier",
"lint:prettier": "prettier --write .",
"lint:prettier:build": "prettier --check ."
}
}
----
+
Use `lint:prettier` during development (to fix code automatically)
and `lint:prettier:build` to verify the build (to fail if code is not formatted).
== Setup Jest
. Add `jest` and related peer dependencies as dev dependencies:
+
[source,json]
----
{
"devDependencies": {
"@types/jest": "^29.5.14",
"jest": "^29.7.0",
"ts-jest": "^29.2.6",
}
}
----
+
. Setup `jest.config.js`:
+
[source,js]
----
import { config } from '@perfective/build/jest';
export default config;
----
+
. Update `package.json` scripts:
+
[source,json]
----
{
"scripts": {
"test": "jest",
"test:build": "jest --clearCache && jest --collectCoverage"
}
}
----
+
Use `test` for development testing
and `test:build` to test during the build (and fail if test coverage is not sufficient).