Skip to content

Conversation

@thomasdarvik
Copy link

@thomasdarvik thomasdarvik commented Jun 4, 2018

The resulting path for font files will be .../themes/themes/... in the generated CSS files using a LESS loader.

The old path @fontPath : '../../themes/default/assets/fonts'; will append a /themes/ in the final URL, resulting in a path that is not valid.

This goes for all the themes in themes if the site.variables's @fontPath is pointing to the "old" path.

I am fairly new to the source code of Semantic, and this might not be the correct place to fix this issue.
I am however, trying to point out a bug, that might seems to be related to this:
This can be a fix for issue 41

The resulting path for font files will be `.../themes/themes/...` if the `@fontPath` is not defined this way.
This goes for all the themes in `themes` if the `site.variables`'s `@fontPath` is pointing to the old path.

This can be a fix for [issue 41](#41)
@FrozenKiwi
Copy link

Leaving notes here, as I've had this issue (several times) and it's costed me days each time.

I had the same issue, directly including the LESS in my compilation. In my configuration I have split out the config & site into my app folder, while keeping the semantic LESS pure in the node_modules. I think this is a bit different, as the general expectation is for people to copy in the whole LESS folder (rather than use a module).

Possibly the difference is that we are using less-loader (which uses webpacks module resolution) vs lessc, which uses something else.

https://webpack.js.org/loaders/less-loader/#imports
General comments on import process (not specifically for this issue, but very useful)
webpack/less-loader#109 (comment)

Finally, instead of the PR-ed fix here, which directly changes the source compilation and only affects one theme, I found a better fix to be in my theme.config (which is specifically for a given site, and will not affect the semantic build. Below the existing code:

/*******************************
         Import Theme
*******************************/

@import (multiple) "theme.less";

Add the following override code

/* 
  If compiling using webpack, and seeing the
  issue of duplicate "./themes/themes" in font paths,
  enable the following override to make the 
  paths compliant with webpack module resolution.
  See: https://github.com/Semantic-Org/Semantic-UI-LESS/pull/42
*/

@fontPath : "../../@{site}/assets/fonts";

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants