preloaders versus postloaders

[texastoland]

Getting ready to try this out and wondered why you recommend preloaders instead of postloaders? Should I not run it after PostCSS? I suppose it wouldn't get picked up by TypeScript then? Does that mean I should compile all my CSS in preloaders?

[olegstepura]

Hi! I recommended to use it in preloaders since typed-css-modules generates typescript files needed in loaders phase to typescript itself.

[texastoland]

Hmm I guess there's no way to pipe through additional loaders just once since TypeScript doesn't use WebPack's require?

[olegstepura]

I'm not typescript compiler expert. I know that typescript itself uses moduleResolution option in tsconfig.json to control one of the two possible build-in loader behaviors. But with webpack we use typescript-loader and you may wish to ask same question there (they should know for sure whether it's possible to inject webpack's loader to typescript or not).

[olegstepura]

@AppShipIt is your question answered? Did you get any more info from typescript experts?

[texastoland]

The root issue is TypeScript doesn't use WebPack to look up modules so this must be run in preloaders (like you recommended). But I don't think it'll work with cssnext without chaining after other PostCSS plugins. That would mean nothing else could run before PostCSS. Stylelint is available as a plugin (order doesn't matter) so perhaps it's not an issue. Since typed-css-modules uses PostCSS css-modules-core maybe my use case would be better served as a PostCSS plugin. Feel free to close I'll try again later!

[mohsen1]

I'm trying to use this loader in my preLoaders but I'm still getting module not found error:

 webpack                                                                1662ms  Sat Jun 25 11:06:27 2016
ts-loader: Using typescript@1.8.10 and /Users/mazimi/Projects/rah-foundation/website/tsconfig.json
Hash: 840e83034d9d41d62337
Version: webpack 1.13.1
Time: 1857ms
    Asset    Size  Chunks             Chunk Names
client.js  879 kB       0  [emitted]  client
    + 236 hidden modules

ERROR in ./components/FAQ/style.css
Module build failed: Error: Could not find file: '/Users/mazimi/Projects/rah-foundation/website/components/FAQ/style.css'.
    at getValidSourceFile (/Users/mazimi/Projects/rah-foundation/website/node_modules/typescript/lib/typescript.js:48860:23)
    at Object.getEmitOutput (/Users/mazimi/Projects/rah-foundation/website/node_modules/typescript/lib/typescript.js:51922:30)
    at Object.loader (/Users/mazimi/Projects/rah-foundation/website/node_modules/ts-loader/index.js:432:34)
 @ ./components/FAQ/index.tsx 8:12-34

Here is my webpack config:
https://github.com/rah-foundation/website/blob/75c4be4cacbfe94c6a1f850d30370e9135354152/webpack.config.ts

Any idea why I'm getting this error?

[olegstepura]

Hi, @mohsen1
I experience the same issue from time to time. Currently I don't know how to solve it. You can take a look at discussion here for more details.

[mitermayer]

I will try this loader out, If i hit the above error I will try to fix it and submit a PR

[mohsen1]

I believe my PR #8 fixed this issue.

[olegstepura]

Hi, guys! FYI: I merged #8 and released v0.0.6 just now.
Not sure if I can close this issue.