Skip to content

gulp serve broken out of the box with CSS option #1760

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

Closed
ggallo opened this issue Apr 7, 2016 · 5 comments
Closed

gulp serve broken out of the box with CSS option #1760

ggallo opened this issue Apr 7, 2016 · 5 comments

Comments

@ggallo
Copy link

ggallo commented Apr 7, 2016

Item Version
generator-angular-fullstack 3.3.0
Node 5.3.0
npm 3.8.5
yo 1.7.0
Operating System OS X 10
Item Answer
Transpiler Babel
Markup HTML
CSS CSS
Router ui-router
Build Tool Gulp
Client Tests Mocha
DB MongoDB
Auth Y

To recreate:

  1. yo angular-fullstack with the options above
  2. gulp serve and you receive this error: Error: Task inject:css is listed more than once. This is probably a typo. Easily fixable, I suspect the second inject:css is meant as a placeholder in case a preprocessor was selected in step 1
  3. Run gulp serve after removing the duplicate command, and localhost:9000 is clearly missing style resources. I suspect that bootstrap and font awesome are not being loaded.

If you generate a second app that's exactly the same, except you select Less as a preprocessor, gulp serve works out of the box, and the demo app appears as expected. (This may hold for other preprocessors, I didn't check.) Could be related to #1466 and #1752

@Awk34
Copy link
Member

Awk34 commented Apr 8, 2016

Try the latest version of the generator

@ggallo
Copy link
Author

ggallo commented Apr 8, 2016

Oops, didn't catch that. But still the same problem with [email protected] after following the exact same steps.

I think it's because with the preprocessor, you get bootstrap and font awesome injected into client/app/app.less, but not with CSS. Just a guess, I'm a bit 🆕 to this stuff.

Here's a reference image for what I'm seeing with CSS:

screen shot 2016-04-08 at 12 07 16 pm

And again, using Less looks great:

screen shot 2016-04-08 at 12 11 18 pm

@ggallo
Copy link
Author

ggallo commented Apr 13, 2016

In fact, the inject:css task seems completely broken across all preprocessor options. Run a gulp serve and in client/index.js, there's nothing inside the injector:css tags. Compare that to the injector:js tags, which contain the necessary scrips after the task.

@dsschnau
Copy link

Hey, just another data point for this issue:

I set up an app to use css (no sass/less/styl), and there was indeed a gulp task that did inject:css twice which caused the error in this report. I didn't look further but I guessed that one of the inject:css tasks would have been for a css preprocessor. I deleted it and moved on but just wanted to let y'all know.

@Awk34
Copy link
Member

Awk34 commented Apr 24, 2016

I believe this has been fixed

@Awk34 Awk34 closed this as completed Apr 24, 2016
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

No branches or pull requests

3 participants