Fix #9412 - import Sass dependencies in vendor folder

.gitignore

@@ -15,6 +15,7 @@
 .sass-cache/*
 .yardoc
 _build
+_vendor
 .customizer
 
 bower_components

bower.json

@@ -28,7 +28,6 @@
   ],
   "dependencies": {
     "jquery": "~2.2.0",
-    "normalize.scss": "^6.0.0",
     "what-input": "~4.0.3"
   }
 }

gulp/config.js

@@ -22,8 +22,8 @@ module.exports = {
   ],
 
   // Sass
-  SASS_DEPS_PATHS: [
-    'node_modules/normalize-scss/sass'
+  SASS_DEPS_FILES: [
+    'node_modules/@(normalize-scss)/sass/**/*.scss'
   ],
 
   SASS_DOC_PATHS: [

gulp/tasks/customizer.js

@@ -46,8 +46,16 @@ gulp.task('customizer:loadConfig', function(done) {
   });
 });
 
+// Prepare dependencies
+gulp.task('customizer:prepareSassDeps', function() {
+  return gulp.src([
+      'node_modules/@(normalize-scss)/sass/**/*.scss'
+    ])
+    .pipe(gulp.dest('_vendor'));
+});
+
 // Creates a Sass file from the module/variable list and creates foundation.css and foundation.min.css
-gulp.task('customizer:sass', ['customizer:loadConfig'], function() {
+gulp.task('customizer:sass', ['customizer:loadConfig', 'customizer:prepareSassDeps'], function() {
   var sassFile = customizer.sass(CUSTOMIZER_CONFIG, MODULE_LIST, VARIABLE_LIST);
 
   // Create a stream with our makeshift Sass file

gulp/tasks/sass.js

@@ -15,14 +15,18 @@ var CONFIG = require('../config.js');
 // Compiles Sass files into CSS
 gulp.task('sass', ['sass:foundation', 'sass:docs']);
 
+// Prepare dependencies
+gulp.task('sass:deps', function() {
+  return gulp.src(CONFIG.SASS_DEPS_FILES)
+    .pipe(gulp.dest('_vendor'));
+});
+
 // Compiles Foundation Sass
-gulp.task('sass:foundation', function() {
+gulp.task('sass:foundation', ['sass:deps'], function() {
   return gulp.src(['assets/*'])
     .pipe(sourcemaps.init())
     .pipe(plumber())
-    .pipe(sass({
-      includePaths: CONFIG.SASS_DEPS_PATHS
-    }).on('error', sass.logError))
+    .pipe(sass().on('error', sass.logError))
     .pipe(autoprefixer({
       browsers: CONFIG.CSS_COMPATIBILITY
     }))
@@ -38,11 +42,11 @@ gulp.task('sass:foundation', function() {
 });
 
 // Compiles docs Sass (includes Foundation code also)
-gulp.task('sass:docs', function() {
+gulp.task('sass:docs', ['sass:deps'], function() {
   return gulp.src('docs/assets/scss/docs.scss')
     .pipe(sourcemaps.init())
     .pipe(sass({
-      includePaths: CONFIG.SASS_DEPS_PATHS.concat(CONFIG.SASS_DOC_PATHS)
+      includePaths: CONFIG.SASS_DOC_PATHS
     }).on('error', sass.logError))
     .pipe(autoprefixer({
       browsers: CONFIG.CSS_COMPATIBILITY

package.json

@@ -17,7 +17,6 @@
   },
   "dependencies": {
     "jquery": "^2.2.0",
-    "normalize-scss": "^6.0.0",
     "what-input": "^4.0.3"
   },
   "license": "MIT",
@@ -74,6 +73,7 @@
     "mocha-phantomjs": "^4.0.2",
     "motion-ui": "^1.1.0",
     "multiline": "^1.0.2",
+    "normalize-scss": "^6.0.0",
     "octophant": "^1.0.0",
     "opener": "^1.4.1",
     "panini": "^1.3.0",

scss/foundation.scss

@@ -6,10 +6,10 @@
  */
 
 // Dependencies
-@import "normalize";
+@import "../_vendor/normalize-scss/sass/normalize";
 
 // Settings
-// import your own `settings` here or 
+// import your own `settings` here or
 // import and modify the default settings through
 // @import "settings/settings";