Font imports in CSS not working, various CSS classnames not working

[agubler]

@sebilasse commented on Fri Jun 02 2017

./src/widgets/Icon/styles/icon.min.css
Module build failed: ModuleParseError: Module parse failed: /Users/sebi/Desktop/redaktorTS2/src/webcomponents/semantic/src/widgets/Icon/styles/fonts/icons.woff2 Unexpected character '�' (1:4)
You may need an appropriate loader to handle this file type.

The same happens for every font file (eot, otf) and many other files that can be imported in CSS. Apart from that reserved TypeScript words do not work but many well known CSS libraries have classes like e.g. .delete.icon ...

Maybe this issue helps https://github.com/css-modules/css-modules/issues/95

---

@agubler commented on Fri Jun 02 2017

@sebilasse this would be a @dojo/cli-build issue

[sebilasse]

@agubler Investigated

I have version 2.0.0-beta1.4 installed (latest on npm) npm webpack.config.js has (gif|png|jpe?g|svg) but here in the master it is (gif|png|jpe?g|svg|eot|ttf|woff|woff2)

So maybe it is already resolved but not on npm. Could I simply swap the webpack.config.js ?

[agubler]

@sebilasse you should be able to just install 2.0.0-beta2.1

[sebilasse]

OK. Did not know. https://github.com/dojo/meta an npm said 1.4 is latest. Thanks.

[agubler]

Yes latest is the same as beta1 if you need to get a more recent "development" release then you can use the next tag or a specific version.

[agubler]

Please can you close out the issue if using the latest release resolves the issue, thanks!

[sebilasse]

@agubler It does not ...

"spec": "2.0.0-beta2.1",

[sebilasse]

after some more hours of investigating (same issue for many users of css-modules) : The workaround ~ as module root did not work. My workaround is to use absolute paths. But this is not suitable because a lot of CSS frameworks (e.g. Bootstrap / Semantic) use relative paths ...

[matt-gadd]

@sebilasse can you run dojo version --o just to confirm that you get:

build (@dojo/cli-build-webpack) 2.0.0-beta2.1 (on latest stable version).

we are using relative paths and assorted font file formats in our internal projects fine after https://github.com/dojo/cli-build/pull/148

[sebilasse]

@matt-gadd build (@dojo/cli-build-webpack) 2.0.0-beta1.4 (can be updated to 2.0.0-beta2.1).

This would mean I have to update the node modules in all 138 semantic ui widgets. Can I somehow use the globally installed cli-build ?

[sebilasse]

@agubler I would later do an issue about updating in dojo/meta. I have rearranged the project structure to one huge dojo app wherein I develop all semantic ui widgets. So now I only need to update one folder but somehow then dojo build webpack --element is not working (can I create all webcomponents in the app in combination with build?) –

The issue here is maybe the sentence in the Readme

to use @dojo/cli-build in every project, install the project globally

This won't work because a local @dojo/cli-build is installed alongside with each project ...

However, apart from this, the issue can be closed. But I am not able to close it (after moving to this repo) ...

[tomdye]

Closing this issue as it seems to be related to an outdated version of cli-build-webpack.