How to setup the typescript-styled-plugin

[predragnikolic]

This is a guide on how to setup the typescript-styled-plugin.

The best is to follow the installation instructions on https://github.com/microsoft/typescript-styled-plugin.

---

1. In terminal run:

   npm install --save-dev typescript-styled-plugin typescript
   npm install --save styled-components  
   npm i --save-dev @types/styled-components

2. The tsconfig.json file should include this plugin:

   {
   "compilerOptions": {
   "plugins": [
     {
       "name": "typescript-styled-plugin",
       "tags": [
         "styled",
         "mytag"
       ]
     }
   ]
   }
   }

3. Optionally configure the tags array.

Create a index.ts file:

import styled from 'styled-components'

styled.button`
    color: blue;
    background: red; 
`

And that is it.

example.zip

[rchl]

I wonder if we should enable and put it in Wiki or Discussions.