Working with Semantic UI full build / LESS variables

Hi there,

I've installed the Semantic UI package via NPM, with a view to building our own stylesheets.

On initial install, and after setting the /src folder as a resource root, it seems that lots of the variables still can not be fully referenced by PHPStorm:

 

 

Is there a known setup / configuration for this?

11 comments
Comment actions Permalink

I suppose, the issue is that the theme.config you are importing is not a .less file, so the IDE can't find any variable definitions there. Can you provide your theme.config and the file(s) where the variables are defined? Are they declared in .less files, or in .variables files?

0
Comment actions Permalink

Hi Elena,

Thanks for looking at this :)

This seems to be the repo which this is built from:

You can see virtually the same files there as here.

I've not looked at Less for years, and this is the first time I have looked at the Semantic build process.

I have now posted an issue on the repo as well, and will hope for some help there as well:

Thank you,
Dave

0
Comment actions Permalink

I saw these files (was not able to install Semantic UI package via NPM though), but i need to know what your setup looks like.

I can tell for sure that variables won't be resolved unless they are defined in .less files (or files treated as LESS files by the IDE)

0
Comment actions Permalink

> I can tell for sure that variables won't be resolved unless they are defined in .less files

That makes sense.

You can install the package using the instructions here if you need to:

When I installed, it asked me a few questions, then copied a bunch of files as you see.

If I have to rename some files and update build scripts, that's OK.

If we can ask PHPStorm to treat some files differently, that's OK too.

Hopefully they will respond on the other ticket, or I can ask them why the config files are not normal .less files.

0
Comment actions Permalink

>You can install the package using the instructions here if you need to

I tried the steps already - npm install semantic-ui fails on my system for unknown reason

>If we can ask PHPStorm to treat some files differently, that's OK too

you can register files as LESS files by adding file names as registered file patterns in Settings | Editor | File Types | Less

0
Comment actions Permalink

> I tried the steps already - npm install semantic-ui fails on my system for unknown reason 

 

Ah, shame.

 

OK, they responded on the other site, and said they are standard .less files, so I'll see if I can't do some fiddling.

 

Thanks for the info so far.

 

0
Comment actions Permalink

"you can register files as LESS files by adding file names as registered file patterns in Settings | Editor | File Types | Less"

Hi Elena,
 
I'm looking at this problem again today.
 
Not sure if I want to globally register .overrides, .config and .variables as LESS files.
 
I saw on stack overflow that there is no way we can do this per project.
 
Is there a way we can bulk-select files and associate them?
0
Comment actions Permalink

No, you can only register patterns manually in Settings | Editor | File Types, there is no way to re-assign a file to certain file type from menus

0
Comment actions Permalink

Actually, you can - Right click > Associate With File Type

I see now that it's for all files though, not just that file.

0
Comment actions Permalink

So I finally got Semantic UI working with PHPStorm, but I had to significantly rewrite the framework:

I could have avoided this by setting PHPStorm to treat all .config, .override and .variables files as Less, but I didn't want to do that.

Elena, is there any way I could have avoided the renames that I had to do?

Cheers,

Dave

0
Comment actions Permalink

>is there any way I could have avoided the renames that I had to do?

You need to let the IDE know that the file is a LESS file. To do this, you have to either change its extension to `.less`, or add file name to LESS file type patterns. As editing file associations is not the thing you'd like to do, renaming files is the only way to go

1

Please sign in to leave a comment.