ts-ci/README.md

157 lines
6.2 KiB
Markdown
Raw Normal View History

2020-05-14 00:47:15 +02:00
<p align="center">
2021-02-26 22:07:23 +01:00
<img src="https://user-images.githubusercontent.com/6702424/109354825-ab4b8e00-787e-11eb-8336-6009415ecaf6.png">
2020-05-14 00:47:15 +02:00
</p>
<p align="center">
2021-10-24 00:23:49 +02:00
<i> 🚀A starter for any TypeScript project meant to be published on NPM🚀</i>
2020-05-14 00:47:15 +02:00
<br>
<br>
</p>
2022-05-06 00:33:04 +02:00
https://user-images.githubusercontent.com/6702424/167035748-4fe28710-ed0f-4feb-a297-bdbdc451c69a.mov
2021-08-01 06:55:05 +02:00
`ts-ci` is a project starter like [TSDX](https://github.com/formium/tsdx) or [typescript-starter](https://github.com/bitjson/typescript-starter) but (arguably) better because:
2021-08-01 06:56:13 +02:00
- It's not a CLI tool, the automation happens with Github Actions.
Update your `package.json` version number, push. Voila, your new version is published on NPM.
2022-01-07 04:17:59 +01:00
- It doesn't bundle your library into a single file so users can cherry-pick what they want to import from your lib, your modules will be tree shakable.
2021-10-15 21:11:47 +02:00
E.g: `import { aSpecificFunction } from "your-module/aSpecificFile"`
2021-08-01 06:49:35 +02:00
<p align="center">
<a href='https://youtu.be/rYaAZg8RYyI'>
<img src="https://user-images.githubusercontent.com/6702424/127759381-f8bb7efe-231c-4540-84bb-fc17c3d4dc38.gif">
</a>
</p>
2021-08-01 03:44:42 +02:00
# How to use
2020-05-14 00:47:15 +02:00
- Click on ![image](https://user-images.githubusercontent.com/6702424/127756563-ec5f2d07-d758-43f1-8fac-387847c0d064.png)
2021-08-01 03:44:42 +02:00
- The repo name you will choose will be used as a module name for NPM.
- Go to the repository ``Settings`` tab, then ``Secrets`` you will need to add a new secret:
``NPM_TOKEN``, you NPM authorization token.
- To trigger publishing edit the ``package.json`` ``version`` field ( ``0.0.0``-> ``0.0.1`` for example) then push changes... that's all !
2022-10-11 16:59:34 +02:00
- Publish pre-release by setting your version number to `X.Y.Z-rc.U` (example: `1.0.0-rc.32`). On NPM the version will be tagged `next`.
- The CI runs on `main` and on the branches that have a PR open on `main`.
2021-08-01 03:44:42 +02:00
# Features
2020-05-14 00:47:15 +02:00
2020-05-16 19:07:19 +02:00
This template automates the boring and tedious tasks of:
2020-05-15 22:51:31 +02:00
- Filling up the ``package.json``
- Setting up Typescript.
2020-10-23 02:53:24 +02:00
- Testing on multiple Node version running on Ubuntu and Windows before publishing.
2020-05-15 22:51:31 +02:00
- Maintaining a CHANGELOG.
2020-05-15 22:57:11 +02:00
- Publishing on NPM and creating corresponding GitHub releases.
2020-05-15 22:51:31 +02:00
2020-05-16 19:07:19 +02:00
Besides, good stuff that comes with using this template:
- The `dist/` directory is not tracked on the ``main`` branch.
2020-05-15 22:51:31 +02:00
- Shorter specific file import path.
``import {...} from "my_module/theFile"`` instead of the usual
``import {...} from "my_module/dist/theFile"``
2021-02-28 10:38:55 +01:00
- ESlint and Prettier are automatically run against files staged for commit. (Optional, you can [disable](#disable-linting-and-formatting) this feature)
2020-05-27 22:02:44 +02:00
2021-05-21 09:54:46 +02:00
# Examples of project using this template
2021-02-28 10:57:13 +01:00
2021-04-13 16:41:32 +02:00
- [keycloakify](https://github.com/garronej/keycloakify)
2021-05-21 09:54:46 +02:00
- [denoify](https://github.com/garronej/denoify)
2021-02-28 10:57:13 +01:00
- [tss-react](https://github.com/garronej/tss-react)
2021-08-01 03:44:42 +02:00
- [EVT](https://github.com/garronej/evt)
2020-05-15 22:51:31 +02:00
2021-08-01 03:44:42 +02:00
# FAQ
2020-05-15 22:51:31 +02:00
2020-08-18 17:06:44 +02:00
<details>
<summary>Click to expand</summary>
## Can I use `npm` instead of `yarn`
Yes, just remove the `yarn.lock` file.
2021-08-01 03:44:42 +02:00
## What will be included in the npm bundle?
2020-08-18 17:06:44 +02:00
All filles listed in [the files property of your package JSON](https://github.com/garronej/ts_ci/blob/974054f2b83f8170317f2b2fa60b5f78e9336c0b/package.json#L35-L41).
2021-12-01 21:21:17 +01:00
## How to debug the action
You can increase the verbosity by creating a new secret `ACTIONS_STEP_DEBUG` and setting it to true.
![image](https://user-images.githubusercontent.com/6702424/144307837-f401c595-4695-45e3-8459-b1c1ca7fabb9.png)
2020-05-27 22:02:44 +02:00
## Disable linting and formatting
Remove [this](https://github.com/garronej/ts_ci/blob/974054f2b83f8170317f2b2fa60b5f78e9336c0b/package.json#L15-L18), [this](https://github.com/garronej/ts_ci/blob/974054f2b83f8170317f2b2fa60b5f78e9336c0b/package.json#L20-L32) and [this](https://github.com/garronej/ts_ci/blob/974054f2b83f8170317f2b2fa60b5f78e9336c0b/package.json#L47-L53) from your `package.json`
Remove [this](https://github.com/garronej/ts_ci/blob/974054f2b83f8170317f2b2fa60b5f78e9336c0b/.github/workflows/ci.yaml#L12-L26) and [this](https://github.com/garronej/ts_ci/blob/974054f2b83f8170317f2b2fa60b5f78e9336c0b/.github/workflows/ci.yaml#L29) from `github/workflows/ci.yaml`
2021-08-01 03:44:42 +02:00
Remove `.eslintignore`, `.eslintrc.js`, `.prettierignore` and `.prettierrc.json`.
2020-08-18 17:06:44 +02:00
2021-08-01 03:44:42 +02:00
## Accessing files outside the ``dist/`` directory
2020-08-18 17:06:44 +02:00
2020-05-15 22:51:31 +02:00
The drawback of having short import path is that the dir structure
is not exactly the same in production ( in the npm bundle ) and in development.
The files and directories in ``dist/`` will be moved to the root of the project.
As a result this won't work in production:
``src/index.ts``
2020-05-14 00:47:15 +02:00
```typescript
2020-05-15 22:51:31 +02:00
import * as fs from "fs";
import * as path from "path";
const str = fs.readFileSync(
2020-05-18 04:57:35 +02:00
path.join(__dirname,"..", "package.json")
2020-05-15 22:51:31 +02:00
).toString("utf8");
2020-05-14 00:47:15 +02:00
```
2020-05-15 22:51:31 +02:00
Because ``/dist/index.js`` will be moved to ``/index.js``
2020-05-14 00:47:15 +02:00
2020-05-15 22:51:31 +02:00
You'll have to do:
2020-05-14 00:47:15 +02:00
2020-05-15 22:51:31 +02:00
``src/index.ts``
```typescript
import * as fs from "fs";
import * as path from "path";
import { getProjectRoot } from "./tools/getProjectRoot";
2020-05-14 00:47:15 +02:00
2020-05-15 22:51:31 +02:00
const str = fs.readFileSync(
path.join(getProjectRoot(),"package.json")
).toString("utf8");
```
2020-05-14 00:47:15 +02:00
2021-08-01 03:44:42 +02:00
With `getProjectRoot.ts` being:
```typescript
import * as fs from "fs";
import * as path from "path";
function getProjectRootRec(dirPath: string): string {
if (fs.existsSync(path.join(dirPath, "package.json"))) {
return dirPath;
}
return getProjectRootRec(path.join(dirPath, ".."));
}
let result: string | undefined = undefined;
2020-08-18 17:06:44 +02:00
2021-08-01 03:44:42 +02:00
export function getProjectRoot(): string {
if (result !== undefined) {
return result;
}
return (result = getProjectRootRec(__dirname));
}
```
## How does the automatic ``CHANGELOG.md`` update works?
Starting from the second release, a ``CHANGELOG.md`` will be created at the root of the repo.
*Example:*
![image](https://user-images.githubusercontent.com/6702424/82747884-c47a5800-9d9d-11ea-8f3b-22df03352e54.png)
The ``CHANGELOG.md`` is built from the commits messages since last release.
Are NOT included in the ``CHANGELOG.md``:
- The commit messages that includes the word "changelog" ( non-case sensitive ).
- The commit messages that start with "Merge branch ".
- The commit messages that with "GitBook: "
*The GitHub release will point to a freezed version of the ``CHANGELOG.md``*:
![image](https://user-images.githubusercontent.com/6702424/82748469-6439e500-9da2-11ea-8552-ea9b7322dfa7.png)
2021-08-01 03:44:42 +02:00
</details>