Initial commit

glen-84 · Oct 1, 2015 · fe328dc · fe328dc
commit fe328dc
Show file tree

Hide file tree

Showing 7 changed files with 93 additions and 0 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,13 @@
+# See: http://EditorConfig.org
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = false
+
+[*.{html,js,scss}]
+indent_style = space
+indent_size = 4
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+node_modules/
diff --git a/dist/index.html b/dist/index.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Test</title>
+    <!-- <link rel="stylesheet" href="/test.css" /> -->
+    <link rel="stylesheet" href="/app/styles/test2.css" />
+</head>
+<body>
+    <main class="container">
+        <button type="button" class="btn btn-primary">Primary</button>
+    </main>
+</body>
+</html>
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
@@ -0,0 +1,46 @@
+import gulp from "gulp";
+import sourcemaps from "gulp-sourcemaps";
+import sass from "gulp-sass";
+import autoprefixer from "gulp-autoprefixer";
+import browserSync from "browser-sync";
+
+let bs = browserSync.create("bs-server");
+
+let cssSrc = "src/**/*.scss";
+let cssDest = "dist";
+
+gulp.task("build-css", () => {
+    return gulp.src(cssSrc)
+        .pipe(sourcemaps.init({debug: true}))
+        .pipe(sass({
+            // See: https://github.com/sass/node-sass/issues/957
+            //outputStyle: "compressed"
+            outputStyle: "expanded"
+        }).on("error", sass.logError))
+        .pipe(autoprefixer({
+            // Default for Browserslist (https://github.com/ai/browserslist) @ 2015/09/18
+            browsers: ["> 1%", "last 2 versions", "Firefox ESR"]
+        }))
+        .pipe(sourcemaps.write(".", {debug: true}))
+        .pipe(gulp.dest(cssDest))
+        .pipe(browserSync.get("bs-server").stream({match: "**/*.css"}));
+});
+
+gulp.task("serve", ["build-css"], () => {
+    bs.init({
+        server: {
+            baseDir: "dist"
+        }
+    });
+});
+
+// Log file changes to the console.
+function reportChange(event) {
+    console.log(`File ${event.path} was ${event.type}, running tasks...`);
+};
+
+gulp.task("watch", ["serve"], () => {
+    gulp.watch("src/**/*.scss", ["build-css"]).on("change", reportChange);
+});
+
+gulp.task("default", ["watch"]);
diff --git a/package.json b/package.json
@@ -0,0 +1,11 @@
+{
+  "devDependencies": {
+    "babel": "^5.8.23",
+    "bootstrap": "git://github.com/twbs/bootstrap.git#v4.0.0-alpha",
+    "browser-sync": "^2.9.3",
+    "gulp": "^3.9.0",
+    "gulp-autoprefixer": "^3.0.2",
+    "gulp-sass": "^2.1.0-beta",
+    "gulp-sourcemaps": "^1.5.2"
+  }
+}
diff --git a/src/app/styles/test2.scss b/src/app/styles/test2.scss
@@ -0,0 +1,3 @@
+$brand-primary: green;
+
+@import "../../../node_modules/bootstrap/scss/bootstrap.scss";
diff --git a/src/test.scss b/src/test.scss
@@ -0,0 +1,3 @@
+$brand-primary: red;
+
+@import "../node_modules/bootstrap/scss/bootstrap.scss";