Template Upload

node_modules/bs-recipes/recipes/proxy.custom-css/app.js

@@ -0,0 +1,22 @@
+/**
+ * Require Browsersync
+ */
+var browserSync = require('browser-sync').create();
+
+/**
+ * Run Browsersync with server config
+ * You can use an arrays for files to specify multiple files
+ */
+browserSync.init({
+    proxy: "example.com",
+    serveStatic: ["app/static"],
+    files: "app/static/_custom.css",
+    snippetOptions: {
+        rule: {
+            match: /<\/head>/i,
+            fn: function (snippet, match) {
+                return '<link rel="stylesheet" type="text/css" href="/_custom.css"/>' + snippet + match;
+            }
+        }
+    }
+});

node_modules/bs-recipes/recipes/proxy.custom-css/app/static/_custom.css

@@ -0,0 +1,3 @@
+body {
+    background: black;
+}

node_modules/bs-recipes/recipes/proxy.custom-css/desc.md

@@ -0,0 +1,2 @@
+
+To see the live-updating and CSS injecting, simply perform changes to `app/static/_custom.css`

node_modules/bs-recipes/recipes/proxy.custom-css/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "bs-recipes-server",
+  "version": "1.0.0",
+  "description": "Proxy example + injecting custom css file",
+  "main": "app.js",
+  "scripts": {
+    "start": "node app.js"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "browser-sync": "^2.11.2"
+  }
+}

node_modules/bs-recipes/recipes/proxy.custom-css/readme.md

@@ -0,0 +1,59 @@
+#Browsersync - Proxy example + injecting custom css file
+
+## Installation/Usage:
+
+To try this example, follow these 4 simple steps. 
+
+**Step 1**: Clone this entire repo
+```bash
+$ git clone https://github.com/Browsersync/recipes.git bs-recipes
+```
+
+**Step 2**: Move into the directory containing this example
+```bash
+$ cd bs-recipes/recipes/proxy.custom-css
+```
+
+**Step 3**: Install dependencies
+```bash
+$ npm install
+```
+
+**Step 4**: Run the example
+```bash
+$ npm start
+```
+
+### Additional Info:
+
+
+
+To see the live-updating and CSS injecting, simply perform changes to `app/static/_custom.css`
+
+### Preview of `app.js`:
+```js
+/**
+ * Require Browsersync
+ */
+var browserSync = require('browser-sync').create();
+
+/**
+ * Run Browsersync with server config
+ * You can use an arrays for files to specify multiple files
+ */
+browserSync.init({
+    proxy: "example.com",
+    serveStatic: ["app/static"],
+    files: "app/static/_custom.css",
+    snippetOptions: {
+        rule: {
+            match: /<\/head>/i,
+            fn: function (snippet, match) {
+                return '<link rel="stylesheet" type="text/css" href="/_custom.css"/>' + snippet + match;
+            }
+        }
+    }
+});
+
+```
+