TypeScript support

[colingourlay]

This big ol' bundle of changes brings full TypeScript support to @abcnews/aunty, across all project types. From here on, you have the choice of writing your source, tests, or both in TypeScript.

tl;dr

npm i -g @abcnews/aunty@next
nt n my-typescript-project
# Enter 'y' when asked "Will you be authoring your project in TypeScript?"
cd my-typescript-project
npm test
npm start

New project generators

All new project templates are available with a TypeScript opt-in prompted during initialisation (aunty new / aunty init). The main differences you'll see from older templates are:

• The Worm graphic is a standalone component, rather than baked into to App component.
• File extensions / content are either .js or .ts(x) depending on your language choice (TypeScript is indicated by <script lang="ts"> in .svelte &.vue files).
• We consistently use SCSS styling across all templates (SCSS is indicated by <style lang="scss"> in .svelte &.vue files).

How to upgrade existing projects

Aunty's extensible internal TypeScript config and definitions for module imports facilitated by webpack's various loaders will have you up and running in existing projects by adding a tsconfig.json file to the root of your project containing the following:

{
  "extends": "@abcnews/aunty/ts/config.json",
  "include": ["src/**/*", "node_modules/@abcnews/aunty/ts/*"]
}

...and installing the relevant DefinitelyTyped dev dependencies:

• All: @types/jest & @types/webpack
• React: @types/react, @types/react-dom & @types/react-test-renderer.

At this point, you should be able to rename any file in your project from .js to .ts (or .tsx if it contains JSX syntax), and test, serve & build to your heart's content.

VSCode setup

The TypeScript compiler will catch problems when serving/building/testing your project, but if you want to take advantage of real-time checking in VSCode, make sure you have the following extensions installed:

• All projects: ESLint; Prettier - Code formatter
• Svelte projects: Svelte for VS Code
• Vue projects: Vetur

[phocks]

Exciting. Just installed. Giving it a try.

[andrewkesper]

Wow what a huge release. I'm trying it out now. Looking good so far!

[andrewkesper]

A potential bug: If I start a Typescript Preact project and then run aunty generate component it generates a Javascript component for me.

[phocks]

A potential bug: If I start a Typescript Preact project and then run aunty generate component it generates a Javascript component for me.

I believe component generation is a feature still to be added @colingourlay ?

[colingourlay]

@andrewkesper component generators will be dropping later today!

[colingourlay]

Alrighty folks, give things another shot now (including component generation)

[colingourlay]

This closes #106