tba-types in tsconfig and fixes
This commit is contained in:
parent
6f7dba42ca
commit
07ee711e88
42
README.md
42
README.md
@ -51,7 +51,7 @@ This template was built in a script-centric workflow. All the `.ts` scripts in t
|
|||||||
|
|
||||||
1. Clone and install the dependencies:
|
1. Clone and install the dependencies:
|
||||||
|
|
||||||
```shell
|
```sh
|
||||||
❯ git clone https://git.autourdeminuit.com/autour_de_minuit/tb-harmony-modern-ts
|
❯ git clone https://git.autourdeminuit.com/autour_de_minuit/tb-harmony-modern-ts
|
||||||
❯ cd tb-harmony-modern-ts
|
❯ cd tb-harmony-modern-ts
|
||||||
❯ npm install
|
❯ npm install
|
||||||
@ -59,7 +59,7 @@ This template was built in a script-centric workflow. All the `.ts` scripts in t
|
|||||||
|
|
||||||
2. Then create a new script in `src/scripts`:
|
2. Then create a new script in `src/scripts`:
|
||||||
|
|
||||||
```shell
|
```sh
|
||||||
❯ touch src/scripts/arrow-function.ts
|
❯ touch src/scripts/arrow-function.ts
|
||||||
```
|
```
|
||||||
|
|
||||||
@ -71,7 +71,7 @@ hello("Alice");
|
|||||||
|
|
||||||
3. And build it:
|
3. And build it:
|
||||||
|
|
||||||
```shell
|
```sh
|
||||||
❯ npm run build # runs webpack
|
❯ npm run build # runs webpack
|
||||||
```
|
```
|
||||||
|
|
||||||
@ -101,6 +101,36 @@ For example you can also run this script from the command line in [batch mode](h
|
|||||||
# Hello, Alice!
|
# Hello, Alice!
|
||||||
```
|
```
|
||||||
|
|
||||||
|
#### NPM scripts
|
||||||
|
|
||||||
|
```sh
|
||||||
|
❯ npm run build # build all the scripts
|
||||||
|
❯ npm run dev # build and watch files on save
|
||||||
|
❯ npm run type-check # TypeScript type check code
|
||||||
|
❯ npm run lint # lint code with ESLint
|
||||||
|
```
|
||||||
|
|
||||||
|
#### I'm building for Harmony version XX
|
||||||
|
|
||||||
|
The type definitions used in TypeScript are specified in the `tsconfig.json` file in the [`compilerOptions.types`](https://www.typescriptlang.org/tsconfig/#types) array.
|
||||||
|
|
||||||
|
To include the types for Harmony 24, do the following:
|
||||||
|
|
||||||
|
```json
|
||||||
|
// tsconfig.json
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
// ...
|
||||||
|
"types": ["tba-types/Harmony/24"]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
`tba-types/Harmony/24` is referring to the path of the types in the [tba-types](https://github.com/bryab/tba-types) package.
|
||||||
|
|
||||||
|
> [!TIP]
|
||||||
|
> You could also use this template to code in StoryboardPro by changing the path to `tba-types/StoryboardPro/24`
|
||||||
|
|
||||||
## How
|
## How
|
||||||
|
|
||||||
Based on the above example, here is a diagram that shows the compilation/transpilation process (simplified):
|
Based on the above example, here is a diagram that shows the compilation/transpilation process (simplified):
|
||||||
@ -176,7 +206,7 @@ var re = /[^\s(/]/; // Syntax error, / is not escaped
|
|||||||
// The correct syntax is /[^\s(\/]/
|
// The correct syntax is /[^\s(\/]/
|
||||||
```
|
```
|
||||||
|
|
||||||
Most of the time, those expressions are injected from corejs polyfills. In order to patch this, I created a custom [`FindReplacePlugin`](./webpack.config.ts) for Webpack that does simple regex find/replace to fix those syntax errors.
|
Most of the time, those expressions are injected from corejs polyfills. In order to patch this, I created a custom [`FindReplacePlugin`](./webpack.config.ts#L15) for Webpack that does simple regex find/replace to fix those syntax errors.
|
||||||
|
|
||||||
## Contributing
|
## Contributing
|
||||||
|
|
||||||
@ -195,3 +225,7 @@ If it's related to the TypeScript type definitions, [open an issue](https://gith
|
|||||||
## License
|
## License
|
||||||
|
|
||||||
[MIT](./LICENSE.md)
|
[MIT](./LICENSE.md)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
Made with ❤️ at [Autour de Minuit (ADV)](https://blog.autourdeminuit.com/) <img src="https://upload.wikimedia.org/wikipedia/commons/0/0c/Blender_logo_no_text.svg" alt="blender" width="20"/>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user