Yeoman gulp webapp change styles directory name

Question

I am developing a theme using the Yeoman Gulp Webapp Generator. The CMS requires a directory called "css" instead of "styles". It sounds simple enough but for some reason I can't get the dist/styles to be dist/css.

From a brand new build I changed the styles directory name to css and them in the gulpfile I searched and replaced all

app/styles

to

 app/css  

This kind of works, the directory in app is now named css but the directory name in dist remains as styles.

I think it gets the name from the .tmp directory? but I'm not sure. If I rename the .tmp/styles to .tmp/css the files are ignored and not transferred to dist.

Any suggestions are much appreciated.

Answer 1

You can also change .tmp/styles in your gulpfile.js to .tmp/css and change this part of index.html :

<!-- build:css styles/main.css -->
<link rel="stylesheet" href="styles/main.css">
<!-- endbuild -->

to this:

<!-- build:css css/main.css -->
<link rel="stylesheet" href="css/main.css">
<!-- endbuild -->

However, if you all you need to do is end up with dist/css , you don't have to change app/styles to app/css and all that, you can just change this part of index.html :

<!-- build:css styles/main.css -->

to this:

<!-- build:css css/main.css -->

That path refers to where in the dist directory will those styles be saved.