scotch / angular-brunch-seed

AngularJS + Brunch
Other
228 stars 78 forks source link

Compiling of 'vendor LESS path here' failed. #69

Closed paprikka closed 11 years ago

paprikka commented 11 years ago

Every time I recompile assets using watch --server, this happens:

vampy_000@RAFAL /d/developer/tn-kontakty (master)
$ brunch w --server
05 May 15:42:44 - info: application started on http://localhost:3333/
05 May 15:42:47 - error: Compiling of 'vendor\bootstrap\less\accordion.less' failed. NameError:variable @baseLineHeight
is undefined in 'vendor\bootstrap\less\accordion.less:8:17'
05 May 15:42:47 - error: Compiling of 'vendor\bootstrap\less\alerts.less' failed. NameError:variable @baseBorderRadius i
s undefined in 'vendor\bootstrap\less\alerts.less:15:17'

I think the problem may be related also to Bower, since my older seed projects which don't use it work fine. I'm using MinGW on a Windows8 machine.

kylefinley commented 11 years ago

@paprikka,

Thanks for reporting this.

The interesting thing is that you appear to be able to read the vendor\bootstrap\less\accordion.less file but you're not able to to read the relative path of _variables.less.

Could you test something for me? Could change line 26 in app\styles\app.less to:

@import "/app/styles/_variables.less";

Please, let me know if that works. If it doesn't, you might have to copy the contents of _variables.less into app.less as a temporary fix, until I can investigate this further.

Thanks,

Kyle

paprikka commented 11 years ago

@kylefinley

Unfortunately, it didn't help at all. I'm afraid there are some issues with relative linking inside vendor less files. Same applies to bootstrap, font-awesome components installed with bower.

I've also noticed that the same error occurs when you try to load sass-based css libs such as ZURB foundation. I've pasted my console output to a gist:

https://gist.github.com/paprikka/5524944

kylefinley commented 11 years ago

Same applies to bootstrap, font-awesome components installed with bower.

So the error only occurs with bower packages? Wild guess -- maybe it has something to do with me ignoring those directories in the .gitignore. Could you try removing those directories from the .gitignore?

I've also noticed that the same error occurs when you try to load sass-based css libs such as ZURB foundation. I've pasted my console output to a gist:

Although, this makes me think that the error is caused by windows use of forward slashes (\)

Sorry for all the question. I'm not able to test this locally, but I really want to find the problem. I know that the bower setup worked on windows at some point (the developer that added it works on windows), but it's quite possible I have broken things since then.

Thank you for your help.

paprikka commented 11 years ago

@kylefinley Still no luck. Well, This may have something to do with bower and backslashes. I had been using Brunch without bower support some time ago on Windows and OSX machines simultaneously for some time, then I switched to a Mac-only environment with no problems at all.

Two weeks ago I switched to a new Windows machine again and now I'm unable to do these two things(maybe related somehow):

Basically, including boostrap in vendor/ without reference to it ain app/ doesn't help either.

FYI, Bower works pretty well on Windows, I've been using it in a lot of non-Brunch projects. I've even managed to use Yeoman without any issues on Windows, which sometimes isn't as easy as it seems:)

I'm not sure, but I think the reason compiling these files fails is the fact that Bootstrap modules are compiled before its dependencies, ie. accordion.less is compiled before variables.less' vars are instantiated. I've removed all bootstrap references from main bootstrap.less files and nothing did change. Any ideas how can I pick only the right single file to import from vendor and maintain some kind of order here?:)

kylefinley commented 11 years ago

Basically, including boostrap in vendor/ without reference to it in app/ doesn't help either.

Angular-brunch-seed is designed to only import less files that are specified in app/styles/app.less all less file are ignored in config.coffee

Any ideas how can I pick only the right single file to import from vendor and maintain some kind of order here?:

It could be that LESS is compiling the files in the wrong orders as you stated, but I think that it's an issue with the import path, but I don't have any way to test it.

The way I would trouble shoot this would be:

  1. Try and import a file from app/styles/app.less

    app/styles/app.less

    @import "test.less";
    
    body {
      background-color: @backgroundColor;
    }

    app/styles/test.less

    @backgroundColor: blue;
  2. If 1 works I would move test.less to vendor/test.less and change the import:

    app/styles/app.less

    @import "/vendor/test.less";
    
    body {
      background-color: @backgroundColor;
    }
  3. if 2 works then .. I don't know what to do.

Any one else reading this that's using windows please fell free to chime in. I like to hear what other's are experiencing on Windows

paprikka commented 11 years ago

Angular-brunch-seed is designed to only import less files that are specified in app/styles/app.less all less file are ignored in config.coffee It could be that LESS is compiling the files in the wrong orders as you stated, but I think that it's an issue with the import path, but I don't have any way to test it.

Well, less files from vendor are compiled even without any import statements in app.less. Looks like these aren't ignored.

I've managed to fix the config file with simple regex pull request

kylefinley commented 11 years ago

Thanks @paprikka I merged the pull request.

Does that help with this issue?

paprikka commented 11 years ago

@kylefinley Hi, yes it does. I don't have access to a mac at the moment, does everything work there too?

I've noticed several other minor bugs on Windows and I'll try to post issues and / or pull requests soon.

kylefinley commented 11 years ago

Excellent! Yes, it works fine on mac.

Thanks for the fix.