# How to regenate ui\_framework/dist/ui\_framework.css

**URL:** <https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975>\
**Category:** Kibana\
**Created:** [June 1, 2017, 7:43pm UTC](https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975 "2017-06-01T19:43:11Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![gloriagu](https://avatars.discourse-cdn.com/v4/letter/g/ed655f/32.png) [@gloriagu](https://discuss.elastic.co/u/gloriagu)\
**Post date:** [June 1, 2017, 7:43pm UTC](https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975/1 "2017-06-01T19:43:11Z")

</div>

I made some color changes to ui\_framework/components/button/index.scss, restart kiabana doesn't see to regenerate ui\_framework/dist/ui\_framework.css. It is a checkin file...how to regenerate it so it will pickup the changes in the component? Thanks.

I ran the command "npm run uiFramework:build" but has error:

> kibana@6.0.0-alpha2 uiFramework:build /home/ggu/500G/kibana  
> grunt uiFramework:build

Loading "Gruntfile.js" tasks...ERROR

> > SyntaxError: Unexpected token {  
> > Warning: Task "uiFramework:build" not found. Use --force to continue.

Aborted due to warnings.

npm ERR! Linux 4.10.1-1-default  
npm ERR! argv "/home/ggu/.nvm/versions/node/v5.5.0/bin/node" "/home/ggu/.nvm/versions/node/v5.5.0/bin/npm" "run" "uiFramework:build"  
npm ERR! node v5.5.0  
npm ERR! npm v3.3.12  
npm ERR! code ELIFECYCLE  
npm ERR! kibana@6.0.0-alpha2 uiFramework:build: `grunt uiFramework:build`  
npm ERR! Exit status 3  
npm ERR!

---

<div class="post-metadata">

**Author:** ![shaunak](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/shaunak/32/6643_2.png) [@shaunak](https://discuss.elastic.co/u/shaunak)\
**Post date:** [June 1, 2017, 8:31pm UTC](https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975/2 "2017-06-01T20:31:57Z")

</div>

Yeah, you're right that `ui_framework/dist/ui_framework.css` needs to be regenerated and checked-in.

To regenerate it, run `npm run uiFramework:start`. This will start up the UI Framework web site, accessible at [http://localhost:8020](http://localhost:8020)`. As part of doing that, it will regenerate`ui\_framework/dist/ui\_framework.css`. Then you can check it in.

---

<div class="post-metadata">

**Author:** ![gloriagu](https://avatars.discourse-cdn.com/v4/letter/g/ed655f/32.png) [@gloriagu](https://discuss.elastic.co/u/gloriagu)\
**Post date:** [June 1, 2017, 8:35pm UTC](https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975/3 "2017-06-01T20:35:03Z")

</div>

Thanks shaunak, however I got error complaining about "SyntaxError: Unexpected token {  
Warning: Task "uiFramework:build" not found. Use --force to continue.". I checked there is a ui\_framework.js under tasks and it has grunt.registerTask('uiFramework:build', function () {...}. Same error if I run " npm run uiFramework:start", can not found the task

---

<div class="post-metadata">

**Author:** ![gloriagu](https://avatars.discourse-cdn.com/v4/letter/g/ed655f/32.png) [@gloriagu](https://discuss.elastic.co/u/gloriagu)\
**Post date:** [June 1, 2017, 11:14pm UTC](https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975/4 "2017-06-01T23:14:00Z")

</div>

I figured out what is wrong, I was using node v5.5.0. The error message threw me off. It just complain about the the task is not there.  
Switch to use node v6.10.2  
nvm install v6.10.2  
however when use that version, it will complain about  
Loading "ui\_framework.js" tasks...ERROR

> > Error: Missing binding /home/ggu/500G/kibana/node\_modules/node-sass/vendor/linux-x64-48/binding.node  
> > Node Sass could not find a binding for your current environment: Linux 64-bit with Node.js 6.x
> > 
> > Found bindings for the following environments:
> > 
> > - Linux 64-bit with Node.js 5.x
> > 
> > This usually happens because your environment has changed since running `npm install`.  
> > Run `npm rebuild node-sass` to build the binding for your current environment.

The clue is there ...so I ran `npm rebuild node-sass`  
npm run uiFramework:start

for some reason just run 'npm run uiFramework:build' won't build the ui\_framework.css file.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [June 29, 2017, 11:14pm UTC](https://discuss.elastic.co/t/how-to-regenate-ui-framework-dist-ui-framework-css/87975/5 "2017-06-29T23:14:36Z")

</div>

Closed on June 29, 2017, 11:14pm UTC

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.