preact-cli-plugin-typescript ·   

Use TypeScript with preact-cli.

This will install typescript
and awesome-typescript-loader.

If you prefer Flow, check out preact-cli-plugin-flow.

Installation

Install via npm:

``shell
npm i preact-cli-plugin-typescript --save-dev
`

After installation, this plugin will create a tsconfig.json (TypeScript
configuration file), and preact.config.js, if they don't exist already.

In the root of your project, edit preact.config.js to add the plugin:

`js
import preactCliTypeScript from 'preact-cli-plugin-typescript'

export default function(config) {
preactCliTypeScript(config)
}
`

Usage

$3

If you have an existing tsconfig.json file, be sure to use the correct
JSX factory:

`json
{
"compilerOptions": {
"jsx": "react",
"jsxFactory": "h"
}
}
`

Now you can simply add .ts/.tsx files to your project, and they'll
be compiled. Cool. Make sure you use .tsx if you want to use JSX.

$3

You might see an error like
Module './components/app' was resolved to '/src/components/app.js', but '--allowJs' is not set..

To fix this, or if you want to incrementally move to TypeScript, make sure
allowJs is enabled in your tsconfig.json:

`json
{
"compilerOptions": {
"allowJs": true
}
}
`

$3

By default, preact-cli looks for src/index.js to start your app. This plugin
widens the scope to "any file in src that starts with index and has
a file extension resolved by webpack" - to change this,
override the preact-cli-entrypoint in preact.config.js:

`js
import { resolve } from 'path'

export default function (config, env, helpers) {
preactCliTypeScript(config)

config.resolve.alias['preact-cli-entrypoint'] = resolve(__dirname, 'src', 'foo-file.foo-extension')
}

``