New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
The Broccoli Plugin: [LESSPlugin] failed with: undefined #873
Comments
I have the same problem, didn't fixed yet... but in my case if I have @import statement insisde the .less file the error occures. Pat |
Same problem here. Any news? Melq |
@melquic Not on my side unfortunately... |
Also getting this error. Seems to happen anytime a component or vendor file is added or removed. Has to do with the |
+1 - also present on Linux based systems |
Same problem here. Has this just been a known issue? Has |
@cvharris as mentioned before, it works, if you move the imported less files out of the return new Angular2App(defaults, {
vendorNpmFiles: [
// ...
],
lessCompiler: {
'paths': [__dirname + '/less'] // this is the important configuration
}
}); But this really is only a workaround for the currently existing problem. |
That did work, thanks for the workaround @j6s. However, this exposed what I think is at the heart of the issue: that compilation errors from At least, that was the source of the issue in my case. |
I agree. We did spend about an hour debugging to come to a conclusion that we could have reached very easily, if the messages would be bubbled out |
I am having an issue importing less and css files with the (less) and (inline) keywords such as: @import (inline) "test.css"; I've tried importing from the same directory and from the node_modules directory and I got the same error.
|
any updates yet? added "less":"^2.0.0" to devDependencies in package.json Still having error added: no luck |
any update?? |
Hey, I had this same issue, it turns out that the stacktrace is because one of the less files is referencing to a variable from a file that is not being imported by the file itself, on less you could have one file that do many imports so that you can split your css on different files. I think we could have the |
Hi, I had same. Pls help me use lessCompliler option ! |
Is this error only because LESS compile errors aren't being bubbled out to
|
Right part of the issue is that the Stacktrace is not that helpful, but also the fact that some less files should not be compiled alone, they are only useful if they get imported from another file. The approach I was following was to set a less compiler property to disable the compile a certain path inside src/app, although if I follow this and modify these files brocoli does not detect a change in this excluded path. I see two issues.
|
Hi, I have closed the previous pull request and generated another one, this one will let you exclude files but at the same time, will let broccoli watch for changes inside this exclusion and trigger a build if any less file changes under the src directory. change. Although, It will also nice to have a way to dump a nice message when the less compiler throws an exception. |
I am still struggling with this issue. The lack of explicitness of the error message is really making things difficult. What is the way of determining what's the real error message? I tried to refer the entry point less file as follows:
Which gives me the same cryptic error message:
Can anyone please tell me how to figure out what the real error message is? For your information, I use the following versions:
P.S. Using the lessc compiler like so |
I had the same error, I think this is only because LESS compiler errors aren't recovered by the Broccoli stacktrace. I had errors when using import statements so i guessed it was a path problem. So you have to defined the src folder in the lessCompiler property of your angular-cli-build.js file.
And then you have to make all your imports from this path :
As LESS errors aren't recovered by the Broccoli stacktrace you don't know what is the problem, so maybe it's not the solution to your problem... but it worked for me. |
Thanks for your message. Can you please tell me where your import:
is located? I am not sure where that is (within index.html for instance). I use SystemJS. Thanks in advance. |
The import statement is located in a LESS file to import another LESS file as mentionned in the LESS documentation : import directive feature. The path of the import is relative to the path declared in the lessCompiler option. |
I see. But how do you refer to the main bootstrap.less file from within your index.html? |
Your boostrap.less file will be compiled into a boostrap.css file in the dist folder of your project. You have just to follow the path from your index.html file to your boostrap.css file like you do to import a classic stylesheet in an html file. |
What you said abvove about the exception being hidden is interesting. Do you or someone else know of any way of having more insight into the underlying exception? I find it impossible to advance blindly. There must be a way of accessing the underlying exception through some debugging... |
I know this is not a proper solution to get less' error message - it is rather a quick and dirty hack dumping the entire error object from less to console: Edit node_modules/angular-cli/lib/broccoli/angular-broccoli-less.js and make the function compile(...) look like this:
In my case, it revealed that one of the input files contained invalid CSS / less code. |
For anyone else trying to use Bootstrap less files to compile, here's how I got it to work. Caveat is that this approach is hard-coded in the dependency. Thanks to @db6edr for pointing out how to display error messages. The error message I got was that Less was trying to compile my Less partials. This workaround forces angular-cli to only compile
Add //...
lessCompiler: {
compress: true,
paths: [ __dirname + '/src/css/less' ],
},
vendorNpmFiles: [
//... Modify build() {
return Promise.all(this.listEntries().map(e => {
if (path.basename(e.relativePath) != 'bootstrap.less') {
return;
}
let fileName = path.resolve(e.basePath, e.relativePath);
return this.compile(fileName, this.inputPaths[0], this.outputPath);
}));
} This is inspired by #1150 fix(sass): don't compile partials pull request. |
Using db6edr's modification of the compile function, I managed to get more insight into the error/stacktrace. Here is the error message:
My IDE does warns me of this with the following message:
Now what puzzles me is that the following manual compilation using the this command line passes without problem:
What could cause this inconsistency between lessc and broccoli? |
I think I am getting why my use of broccoli-less fails. I need just one less file to be compiled and not all less files within the directory mentioned by If I change the
to this:
Then a Now I can't obviously fiddle with the |
Closed as this issue was made obsolete by #1455. |
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Mac OSX (El Capitan)
angular-cli: 1.0.0-beta.5
node: 4.3.1
os: darwin x64
I have installed less css
I am trying to get less css to work with my angular CLI- generated application.
I have tried and configure the plugin as follows in angular-cli-build.js
Can anyone please help?
The text was updated successfully, but these errors were encountered: