Added configurable output folders for JS and CSS

igr · May 12, 2019 · c72ec13 · c72ec13
1 parent f12f9b2
commit c72ec13
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 12 deletions.
diff --git a/spig/spig-config.js b/spig/spig-config.js
@@ -16,10 +16,7 @@ const siteDefaults = {
   // production or development mode
   production: false,
 
-  // names
-  names: {
-    bundle_js: 'main.js'
-  },
+  assets: {},
 
   // data folder
   data: {},
@@ -36,11 +33,10 @@ const siteDefaults = {
 
 const devDefaults = {
 
-  // main folders
+  // source root folder
   srcDir:       './src',
-  outDir:       './out',
 
-  // relative folders
+  // relative source folders
   dirSite:      '/site',
   dirImages:    '/images',
   dirJs:        '/js',
@@ -49,6 +45,18 @@ const devDefaults = {
   dirStatic:    '/static',
   dirLayouts:   '/layouts',
 
+  // output root folder
+  outDir:       './out',
+
+  // relative output folders
+  dirJsOut:     '/js',
+  dirCssOut:    '/css',
+
+  // names
+  names: {
+    bundle_js: 'main.js'
+  },
+
   // images to be resized
   resizeImageSizes: [400, 1000],
 

diff --git a/spig/tasks/sass.js b/spig/tasks/sass.js
@@ -13,6 +13,8 @@ const SpigConfig = require('../spig-config');
 gulp.task('sass', () => {
   const dev = SpigConfig.dev;
 
+  SpigConfig.site.assets['dir_css'] = dev.dirCssOut;
+
   return gulp.src([dev.srcDir + dev.dirCss + '/**/*.s?ss'])
     .pipe(sourcemaps.init())
     .pipe(plumber())
@@ -24,6 +26,6 @@ gulp.task('sass', () => {
     }))
     .pipe(gulpif(SpigConfig.site.production, cssnano()))
     .pipe(sourcemaps.write('.'))
-    .pipe(gulp.dest(dev.outDir + dev.dirCss))
+    .pipe(gulp.dest(dev.outDir + dev.dirCssOut))
     .pipe(browserSync.stream());
 });
diff --git a/spig/tasks/scripts.js b/spig/tasks/scripts.js
@@ -13,6 +13,10 @@ const SpigConfig = require('../spig-config');
 
 gulp.task('js', () => {
   const dev = SpigConfig.dev;
+
+  SpigConfig.site.assets['dir_js'] = dev.dirJsOut;
+  SpigConfig.site.assets['bundle_js'] = dev.dirJsOut + '/' + SpigConfig.dev.names.bundle_js;
+
   return gulp.src([dev.srcDir + dev.dirJs + '/**/*.js'])
     .pipe(plumber())
     .pipe(gulpif(SpigConfig.dev.jsUseBabel, webpack({
@@ -26,9 +30,9 @@ gulp.task('js', () => {
         }
       }]
     })))
-    .pipe(concat(SpigConfig.site.names.bundle_js))
+    .pipe(concat(SpigConfig.dev.names.bundle_js))
     .pipe(gulpif(SpigConfig.site.production, uglify()))
     .pipe(sourcemaps.write('.'))
-    .pipe(gulp.dest(dev.outDir + dev.dirJs))
+    .pipe(gulp.dest(dev.outDir + dev.dirJsOut))
     .pipe(browserSync.stream());
 });
diff --git a/src/layouts/base.njk b/src/layouts/base.njk
@@ -3,7 +3,8 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link href="/css/main.css" rel="stylesheet" type="text/css">
+    <link href="{{ site.assets.dir_css }}/main.css" rel="stylesheet" type="text/css">
+    <script type="text/javascript" src="{{ site.assets.bundle_js }}"></script>
     <title>{{ page.title }}</title>
   </head>
   <body>
@@ -16,6 +17,6 @@
 
     {% include "footer.njk" %}
 
-    <script type="text/javascript" src="{{ site.dirJs }}/{{ site.names.bundle_js }}"></script>
+    <script type="text/javascript" src="{{ site.assets.bundle_js }}"></script>
   </body>
 </html>