Importing CSS files

[pburtchaell]

As of right now, my setup is that I have one CSS file in app/styles/app.css, which imports a number of modules. For example:

@import 'utils/variables.css';
@import 'modules/typography/headings.css';
@import 'modules/buttons/base.css';
@import 'modules/forms/base.css';
@import 'modules/layout/grid.css';
@import 'modules/layout/reset.css';

This CSS file is required in app/app.js.

import './styles/app';`

When I make a change to one of the module files, WebPack does not run. It will only run if I change app/styles/app.css—which makes sense, but is a bit inconvenient. I'm using the postcss-loader plugin to handle my @import declarations, so WebPack wouldn't know to "watch" the CSS files that are imported.

Is there a way to work around this issue though? Maybe by specifying a glob of files to watch in the PostCSS config?

[ai]

Double for #8

[ai]

Current answer: use a webpack dependency :)

[pburtchaell]

Ah, didn't realize that was the same issue at a first glance. I'll jump in on the conversation there.