diff --git a/Makefile b/Makefile
index e178d84b8c995..f993e4ee223ca 100644
--- a/Makefile
+++ b/Makefile
@@ -10,14 +10,18 @@ npm-update:
 	npm update
 
 # Building
-build-js:
+build-js: build-css
 	npm run dev
 
 build-js-production:
 	npm run build
 
-watch-js:
-	npm run watch
+watch-js: build-css
+	npm run watch &
+	npm run sass:watch
+
+build-css:
+	npm run sass:icons
 
 # Linting
 lint-fix:
diff --git a/core/src/icons.js b/core/src/icons.js
index 6ea8070c9128a..97a9253dc48e7 100644
--- a/core/src/icons.js
+++ b/core/src/icons.js
@@ -332,4 +332,5 @@ css += generateVariablesAliases(true)
 css += '}'
 
 // WRITE CSS
+fs.mkdir('dist', (err) => { if (err) { console.info('Directory dist/ already exists') } })
 fs.writeFileSync(path.join(__dirname, '../../dist', 'icons.css'), sass.compileString(css).css)
diff --git a/package.json b/package.json
index b9aca3f9becd0..1876fce014061 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
   },
   "scripts": {
     "build": "NODE_ENV=production webpack --progress --config webpack.prod.js",
+    "postbuild": "npm run sass && npm run sass:icons",
     "dev": "NODE_ENV=development webpack --progress --config webpack.dev.js",
     "watch": "NODE_ENV=development webpack --progress --watch --config webpack.dev.js",
     "lint": "eslint '**/src/**/*.{vue,js}'",