Skip to content

How to use postcss-typescript-css plugin with webpack 2, React, TypeScript and PostCSS

License

Notifications You must be signed in to change notification settings

ezavile/postcss-typescript-css-example

Repository files navigation

postcss-typescript-css-example

How to use postcss-typescript-css plugin with webpack 2, React, TypeScript and PostCSS

This project has two components Card and Title. Each component has its own style file. The Card Component is using postcss-modules.

Usage

TitleComponent

title.css (I'm using cssnext)

.Title {
  color: #444;
  margin: 0;
  &-description  {
    color: #acb2b5;
    margin-bottom: 0;
    }
}

Title.tsx

import  './title.css';
import { titleStyle } from  './titleStyle';

So, titleStyle is an object with two properties:

titleStyle  =  {
  title: 'Title',
  titleDescription: 'Title-description',
}

Now you can use it

<h1 className={titleStyle.title}>Welcome to postcss-typescript-css!</h1>
<h3 className={titleStyle.titleDescription}>This is an example using the plugin with webpack 2, React, TypeScript and PostCSS</h3>

About

How to use postcss-typescript-css plugin with webpack 2, React, TypeScript and PostCSS

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published