Fix #9412 - import Sass dependencies in vendor folder

Previous PR: https://github.com/zurb/foundation-sites/pull/9449

Changes:
- Revert https://github.com/zurb/foundation-sites/pull/9430 - Make
`normalize-scss` a dev dependency.
- Copy Sass dependencies to `/_vendor/scss` and import them in Sass
from there.

Why not importing the Sass dependencies as real dependencies and from
`node_modules`: we cannot assume the path to our real dependencies. Old
npm versions store them in our `node_modules` folder, while newer
versions store them in the `node_modules` folder of the root project.

diff --git a/.npmignore b/.npmignore
index 95048910605e598e71a024a15e04af1fd992a7ff..e0b187f54909c58c47dcb7e40082beae9e30d4b8 100644 (file)
--- a/.npmignore
+++ b/.npmignore
@@ -1,5 +1,6 @@
 .sass-cache
 _build
+_vendor
 bower_components
 config
 docs

diff --git a/bower.json b/bower.json
index 0c8cc8982b80f347fc3ac566eb2b8fe0eeac815b..c041e56ad5bd781b63ef157dee57de03433dabce 100644 (file)
--- a/bower.json
+++ b/bower.json
@@ -28,7 +28,6 @@
   ],
   "dependencies": {
     "jquery": "~2.2.0",
-    "normalize.scss": "^6.0.0",
     "what-input": "~4.0.3"
   }
 }

diff --git a/gulp/config.js b/gulp/config.js
index 1b3362565a34f47bc7bc199a098f13f2598b44b9..74d2de5a02ebe5548b50258e77007b93b6a12a86 100644 (file)
--- a/gulp/config.js
+++ b/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: [

diff --git a/gulp/tasks/customizer.js b/gulp/tasks/customizer.js
index f2964f58e89a3ba8c377c7fefd38c54874fc8d3d..3685222a02d1efd1c08b04654bd5403c06c2a03a 100644 (file)
--- a/gulp/tasks/customizer.js
+++ b/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/scss'));
+});
+
 // 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

diff --git a/gulp/tasks/sass.js b/gulp/tasks/sass.js
index 5f0ffaeba3376474399d1122ad77b2d197ff0948..83ca4759c9d2a641b2a079acf0822f9038b9c655 100644 (file)
--- a/gulp/tasks/sass.js
+++ b/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/scss'));
+});
+
 // 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

diff --git a/package.json b/package.json
index f264423c7a3490ad0d2d7f4941ecff9623becb39..5e79dc969f4a5501d0228384882addb167c26fa4 100644 (file)
--- a/package.json
+++ b/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",

diff --git a/scss/foundation.scss b/scss/foundation.scss
index d396c97a1ebfaf58be18024a26d98293ebeb5e4a..d0c58689cf614531ef58039c76af87bdfd77224f 100644 (file)
--- a/scss/foundation.scss
+++ b/scss/foundation.scss
@@ -6,10 +6,10 @@
  */
 
 // Dependencies
-@import "normalize";
+@import "../_vendor/scss/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";