Utilize node modules better

README.md

@@ -58,11 +58,13 @@
 	* With [rbenv](https://github.com/rbenv/rbenv) (**recommended!**): `rbenv install`
 	* With [RVM](https://rvm.io): `rvm install "ruby-$(cat .ruby-version)"`
 	* [Manually](https://www.ruby-lang.org/en/downloads/)
+1. Install node.js and npm
 1. Install [Bundler](https://bundler.io/) v2.2.5:
 	* `gem install bundler:2.2.5`
 1. Install the required dependencies:
 	* `bundle install`
+	* `npm install`
 1. Build the website (the output can be found in the `_site` directory):
-	* `bundle exec jekyll build`
+	* `npm run build`
 1. Serve the website locally with live reloading:
-	* `bundle exec jekyll serve --incremental --livereload`
+	* `npm run serve`

_config.yml

@@ -22,7 +22,7 @@ description: >- # this means to ignore newlines until "baseurl:"
 baseurl: "" # the subpath of your site, e.g. /blog
 url: "https://www.privacyguides.org" # the base hostname & protocol for your site, e.g. http://example.com
 sass:
-    sass_dir: ./_sass
+    sass_dir: _sass
 excerpt_separator: <!--more-->
 collections_dir: collections
 collections:

_includes/head.html

@@ -35,6 +35,6 @@
 
   <!-- CSS stylesheets -->
   <link href="/assets/css/app.css?v=1" rel="stylesheet">
-  <link href="/assets/fonts/fontawesome/css/all.min.css" rel="stylesheet">
+  <link href="/assets/fonts/vendor/fontawesome/css/all.min.css" rel="stylesheet">
   <link id="dark-css" href="/assets/css/dark.css?v=1" rel="stylesheet" media="(prefers-color-scheme: dark)">
 </head>

_layouts/default.html

@@ -8,8 +8,8 @@
     <main>
       {{ content }}
     </main>
-  <script src="/assets/js/jquery.min.js?v=5"></script>
-  <script src="/assets/js/bootstrap.bundle.js?v=5"></script>
+  <script src="/assets/js/vendor/jquery.min.js"></script>
+  <script src="/assets/js/vendor/bootstrap.bundle.min.js"></script>
   <script src="/assets/js/sortable.min.js?v=5"></script>
   <script src="/assets/js/main.js?v=6"></script>
 </body>

_sass/bootstrap

@@ -1 +0,0 @@
-../node_modules/bootstrap/scss

assets/css/app.scss

@@ -17,7 +17,7 @@ h1, h2, h3:not(.h5), h4 {
 }
 
 // import /_sass/bootstrap.scss
-@import "bootstrap/bootstrap";
+@import "./node_modules/bootstrap/scss/bootstrap";
 @import "ptio-font";
 @import "flag-icon";
 

assets/css/dark.scss

@@ -46,7 +46,7 @@ $dropdown-link-hover-bg: lighten( $dropdown-bg, 10% );
 }
 
 // import /_sass/bootstrap.scss
-@import "bootstrap/bootstrap";
+@import "./node_modules/bootstrap/scss/bootstrap";
 @import "ptio-font";
 @import "flag-icon";
 

assets/fonts/fontawesome

@@ -1 +0,0 @@
-../../node_modules/@fortawesome/fontawesome-pro

assets/js/bootstrap.bundle.js

@@ -1 +0,0 @@
-../../node_modules/bootstrap/dist/js/bootstrap.bundle.js

assets/js/bootstrap.bundle.js.map

@@ -1 +0,0 @@
-../../node_modules/bootstrap/dist/js/bootstrap.bundle.js.map

assets/js/bootstrap.min.js

@@ -1 +0,0 @@
-../../node_modules/bootstrap/dist/js/bootstrap.min.js

assets/js/bootstrap.min.js.map

@@ -1 +0,0 @@
-../../node_modules/bootstrap/dist/js/bootstrap.min.js.map

assets/js/jquery.min.js

@@ -1 +0,0 @@
-../../node_modules/jquery/dist/jquery.min.js

package-lock.json

@@ -5,6 +5,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "privacyguides",
       "version": "1.0.0",
       "license": "ISC",
       "dependencies": {

package.json

@@ -4,7 +4,11 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "assets:copy:js": "cp node_modules/bootstrap/dist/js/bootstrap.bundle.min.js assets/js/vendor/ && cp node_modules/jquery/dist/jquery.min.js assets/js/vendor/",
+    "assets:copy:icons": "mkdir -p assets/fonts/vendor/fontawesome && cp -R \"node_modules/@fortawesome/fontawesome-pro/\" assets/fonts/vendor/fontawesome",
+    "assets:install": "npm run assets:copy:js && npm run assets:copy:icons",
+    "build": "npm run assets:install && bundle exec jekyll build",
+    "serve": "npm run assets:install && bundle exec jekyll serve  --incremental --livereload"
   },
   "repository": {
     "type": "git",