KatieMFritz · October 3, 2019 13:48 · May 10, 2017 · May 10, 2017 · May 10, 2017 · May 10, 2017
diff --git a/0_Sassy_Pattern_Lab.md b/0_Sassy_Pattern_Lab.md
@@ -11,4 +11,4 @@ Once everything is updated, test with `gulp patternlab:build`.
 For `bootstrap-sass`:
 ```scss
 @import '../../../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss';
-``
+```
diff --git a/0_Sassy_Pattern_Lab.md b/0_Sassy_Pattern_Lab.md
@@ -6,4 +6,9 @@ Then update `gulpfile.js`, then `patternlab-config.json`.
 
 If you're renaming your default stylesheet, update it in `source/_meta/_00-head.mustache`.
 
-Once everything is updated, test with `gulp patternlab:build`.
+Once everything is updated, test with `gulp patternlab:build`.
+
+For `bootstrap-sass`:
+```scss
+@import '../../../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss';
+``
diff --git a/Sassy_Pattern_Lab.md → 0_Sassy_Pattern_Lab.md b/Sassy_Pattern_Lab.md → 0_Sassy_Pattern_Lab.md
diff --git a/README.md → Sassy_Pattern_Lab.md b/README.md → Sassy_Pattern_Lab.md
diff --git a/README.md b/README.md
@@ -4,4 +4,6 @@ Then update `package.json` and run `npm install` in the command line.
 
 Then update `gulpfile.js`, then `patternlab-config.json`.
 
+If you're renaming your default stylesheet, update it in `source/_meta/_00-head.mustache`.
+
 Once everything is updated, test with `gulp patternlab:build`.
diff --git a/README.md b/README.md
@@ -2,4 +2,6 @@ First [install patternlab/edition-node-gulp](https://github.com/pattern-lab/edit
 
 Then update `package.json` and run `npm install` in the command line.
 
-Then update `gulpfile.json`. 
+Then update `gulpfile.js`, then `patternlab-config.json`.
+
+Once everything is updated, test with `gulp patternlab:build`.
diff --git a/patternlab-config.json b/patternlab-config.json
@@ -1,7 +1,5 @@
- /**
-  Update paths > source to add
- **/
+/* Update paths > source to add */
 
   "scss" : "./source/css/scss"
 
-/** or whatever your scss path will be */
+/* or whatever your scss path will be */
diff --git a/patternlab-config.json b/patternlab-config.json
@@ -1,6 +1,7 @@
- /***
- "paths" : {
-    "source" : { 
-    ...
-    ***/
-  "scss" : "./source/css/scss"
+ /**
+  Update paths > source to add
+ **/
+
+  "scss" : "./source/css/scss"
+
+/** or whatever your scss path will be */
diff --git a/patternlab-config.json b/patternlab-config.json
@@ -0,0 +1,6 @@
+ /***
+ "paths" : {
+    "source" : { 
+    ...
+    ***/
+  "scss" : "./source/css/scss"
diff --git a/gulpfile.js b/gulpfile.js
@@ -22,17 +22,6 @@ gulp.task('pl-sass', function(){
 
 
 
-ADD TO BEGINNING OF WATCHERS RIGHT AFTER `const watchers = [`
-
-{
-  name: 'Sass',
-  paths: [normalizePath(paths().source.scss, '**', '*.scss')],
-  config: { awaitWriteFinish: true },
-  tasks: gulp.series('pl-sass', reloadCSS)
-},
-
-
-
 UPDATE `GULP.TASK('PL-ASSETS')` TO BE THIS
 
 gulp.task('pl-assets', gulp.series(
@@ -43,4 +32,15 @@ gulp.task('pl-assets', gulp.series(
   gulp.series('pl-sass', 'pl-copy:css', function(done){done();}),
   'pl-copy:styleguide',
   'pl-copy:styleguide-css'
-));
+));
+
+
+
+ADD TO BEGINNING OF WATCHERS RIGHT AFTER `const watchers = [`
+
+{
+  name: 'Sass',
+  paths: [normalizePath(paths().source.scss, '**', '*.scss')],
+  config: { awaitWriteFinish: true },
+  tasks: gulp.series('pl-sass', reloadCSS)
+},
diff --git a/gulpfile.js b/gulpfile.js
@@ -22,15 +22,15 @@ gulp.task('pl-sass', function(){
 
 
 
-  ADD TO BEGINNING OF WATCHERS
-
- {
-      name: 'Sass',
-      paths: [normalizePath(paths().source.scss, '**', '*.scss')],
-      config: { awaitWriteFinish: true },
-      tasks: gulp.series('pl-sass', reloadCSS)
-    },
-      
+ADD TO BEGINNING OF WATCHERS RIGHT AFTER `const watchers = [`
+
+{
+  name: 'Sass',
+  paths: [normalizePath(paths().source.scss, '**', '*.scss')],
+  config: { awaitWriteFinish: true },
+  tasks: gulp.series('pl-sass', reloadCSS)
+},
+
 
 
 UPDATE `GULP.TASK('PL-ASSETS')` TO BE THIS

diff --git a/README.md b/README.md
@@ -1 +1,5 @@
-First [install patternlab/edition-node-gulp](https://github.com/pattern-lab/edition-node-gulp#use-npm).
+First [install patternlab/edition-node-gulp](https://github.com/pattern-lab/edition-node-gulp#use-npm).
+
+Then update `package.json` and run `npm install` in the command line.
+
+Then update `gulpfile.json`. 
diff --git a/gulpfile.js b/gulpfile.js
@@ -1,14 +1,12 @@
 BEGINNING
 
-
 //Add Sass support
 var sass = require('gulp-sass');
   sourcemaps = require('gulp-sourcemaps');
 
 
-/**
-  AFTER PL-COPY:FONT AND BEFORE PL-COPY:CSS
-**/
+
+AFTER PL-COPY:FONT AND BEFORE PL-COPY:CSS
 
 // SASS Compilation
 // http://www.brianmuenzenmeyer.com/adding-common-gulp-tasks-to-pattern-lab-node
@@ -24,20 +22,18 @@ gulp.task('pl-sass', function(){
 
 
 
-
-/** 
   ADD TO BEGINNING OF WATCHERS
-**/
+
  {
       name: 'Sass',
       paths: [normalizePath(paths().source.scss, '**', '*.scss')],
       config: { awaitWriteFinish: true },
       tasks: gulp.series('pl-sass', reloadCSS)
     },
 
-/**
-   UPDATE GULP.TASK('PL-ASSETS') TO BE THIS
-**/
+
+
+UPDATE `GULP.TASK('PL-ASSETS')` TO BE THIS
 
 gulp.task('pl-assets', gulp.series(
   'pl-copy:js',

diff --git a/README.md b/README.md
@@ -1,4 +1 @@
-Command Line:
-`npm install node-sass`
-
-Gulp
+First [install patternlab/edition-node-gulp](https://github.com/pattern-lab/edition-node-gulp#use-npm).
diff --git a/gulpfile.js b/gulpfile.js
@@ -1,7 +1,15 @@
-/** Add Sass support **/ 
+BEGINNING
+
+
+//Add Sass support
 var sass = require('gulp-sass');
   sourcemaps = require('gulp-sourcemaps');
 
+
+/**
+  AFTER PL-COPY:FONT AND BEFORE PL-COPY:CSS
+**/
+
 // SASS Compilation
 // http://www.brianmuenzenmeyer.com/adding-common-gulp-tasks-to-pattern-lab-node
 // https://www.sitepoint.com/simple-gulpy-workflow-sass/
@@ -14,14 +22,23 @@ gulp.task('pl-sass', function(){
     .pipe(gulp.dest(path.resolve(paths().source.css)));
 });
 
-// add to watchers
+
+
+
+/** 
+  ADD TO BEGINNING OF WATCHERS
+**/
  {
       name: 'Sass',
       paths: [normalizePath(paths().source.scss, '**', '*.scss')],
       config: { awaitWriteFinish: true },
       tasks: gulp.series('pl-sass', reloadCSS)
     },
 
+/**
+   UPDATE GULP.TASK('PL-ASSETS') TO BE THIS
+**/
+
 gulp.task('pl-assets', gulp.series(
   'pl-copy:js',
   'pl-copy:img',

diff --git a/instructions.md → README.md b/instructions.md → README.md
diff --git a/package.json b/package.json
@@ -0,0 +1,4 @@
+"devDependencies": {    
+  "gulp-sourcemaps": "^2.6.0",
+  "gulp-sass": "^3.1.0"
+}
diff --git a/instructions.md b/instructions.md
@@ -1,4 +1,4 @@
 Command Line:
-`npm install node-sass'
+`npm install node-sass`
 
 Gulp
diff --git a/gulpfile.js b/gulpfile.js
@@ -0,0 +1,33 @@
+/** Add Sass support **/ 
+var sass = require('gulp-sass');
+  sourcemaps = require('gulp-sourcemaps');
+
+// SASS Compilation
+// http://www.brianmuenzenmeyer.com/adding-common-gulp-tasks-to-pattern-lab-node
+// https://www.sitepoint.com/simple-gulpy-workflow-sass/
+gulp.task('pl-sass', function(){
+  return gulp
+    .src(path.resolve(paths().source.scss, '**/*.scss'))
+    .pipe(sourcemaps.init())
+    .pipe(sass().on('error', sass.logError))
+    .pipe(sourcemaps.write())
+    .pipe(gulp.dest(path.resolve(paths().source.css)));
+});
+
+// add to watchers
+ {
+      name: 'Sass',
+      paths: [normalizePath(paths().source.scss, '**', '*.scss')],
+      config: { awaitWriteFinish: true },
+      tasks: gulp.series('pl-sass', reloadCSS)
+    },
+
+gulp.task('pl-assets', gulp.series(
+  'pl-copy:js',
+  'pl-copy:img',
+  'pl-copy:favicon',
+  'pl-copy:font',
+  gulp.series('pl-sass', 'pl-copy:css', function(done){done();}),
+  'pl-copy:styleguide',
+  'pl-copy:styleguide-css'
+));
diff --git a/instructions.md b/instructions.md
@@ -0,0 +1,4 @@
+Command Line:
+`npm install node-sass'
+
+Gulp
No results found