From 6c782fbbf0dae56af21fd966e5ca5c2b2c2dc7e8 Mon Sep 17 00:00:00 2001
From: Mark <1446916+markcellus@users.noreply.github.com>
Date: Sat, 13 Mar 2021 17:24:34 -0500
Subject: [PATCH] Build dist into examples dir during local dev

---
 examples/scroll-to-element.html |  2 +-
 examples/vertical-scroll.html   |  2 +-
 package.json                    |  2 +-
 rollup.config.js                | 92 +++++++++++++++++----------------
 4 files changed, 51 insertions(+), 47 deletions(-)

diff --git a/examples/scroll-to-element.html b/examples/scroll-to-element.html
index 075ba6d..22902a6 100644
--- a/examples/scroll-to-element.html
+++ b/examples/scroll-to-element.html
@@ -53,7 +53,7 @@
 
         <!-- update the path to scroll script below -->
         <script type="module">
-            import { scrollTo, scrollIntoView } from '../dist/scroll.min.js';
+            import { scrollTo, scrollIntoView } from './dist/scroll.min.js';
             const scrollButton = document.getElementById('scroll-btn');
             const greenBox = document.querySelector('.green');
             const pink = document.querySelector('.pink');
diff --git a/examples/vertical-scroll.html b/examples/vertical-scroll.html
index 2cc3753..f31042d 100644
--- a/examples/vertical-scroll.html
+++ b/examples/vertical-scroll.html
@@ -51,7 +51,7 @@
 
         <!-- update the path to scroll script below -->
         <script type="module">
-            import { scrollTo } from '../dist/scroll.min.js';
+            import { scrollTo } from './dist/scroll.min.js';
             const scrollButton = document.getElementById('scroll-btn');
 
             // when the scroll button is clicked, scroll down 2000 pixels
diff --git a/package.json b/package.json
index a79afeb..5e5542d 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "preversion": "npm test",
     "build": "rm -rf dist/* && rollup -c",
     "banner": "banner-cli dist/*.js",
-    "start": "rollup -c --watch",
+    "start": "rm -rf examples/dist/* && rollup -c --watch",
     "lint": "npm run lint:scripts && npm run lint:format",
     "lint:scripts": "eslint '**/*.{js,ts}'",
     "lint:format": "prettier --check '**/*'",
diff --git a/rollup.config.js b/rollup.config.js
index 9e9c16c..5d2fe89 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -5,50 +5,54 @@ import serve from 'rollup-plugin-serve';
 import commonjs from '@rollup/plugin-commonjs';
 import resolve from '@rollup/plugin-node-resolve';
 
-export default [
-    {
-        input: 'src/scroll.ts',
-        output: {
-            format: 'esm',
-            file: 'dist/scroll.js',
+export default function (commandOptions) {
+    const distPath = commandOptions.watch ? 'examples/dist' : 'dist';
+    return [
+        {
+            input: 'src/scroll.ts',
+            output: {
+                format: 'esm',
+                file: `${distPath}/scroll.js`,
+            },
+            plugins: [typescript()],
+            watch: {
+                include: 'src/**',
+            },
         },
-        plugins: [typescript()],
-        watch: {
-            include: 'src/**',
-        },
-    },
-    {
-        input: 'dist/scroll.js',
-        output: {
-            format: 'umd',
-            name: 'Scroll',
-            file: 'dist/scroll.common.js',
-        },
-        plugins: [
-            resolve({ browser: true }),
-            commonjs(),
-            babel({
-                extensions: ['.js'],
-            }),
-        ],
-    },
-    {
-        input: 'dist/scroll.js',
-        output: {
-            format: 'esm',
-            file: 'dist/scroll.min.js',
+        {
+            input: `${distPath}/scroll.js`,
+            output: {
+                format: 'umd',
+                name: 'Scroll',
+                file: `${distPath}/scroll.common.js`,
+            },
+            plugins: [
+                resolve({ browser: true }),
+                commonjs(),
+                babel({
+                    extensions: ['.js'],
+                }),
+            ],
         },
-        plugins: [
-            terser({
-                compress: true,
-                mangle: true,
-            }),
-            process.env.ROLLUP_WATCH &&
-                serve({
-                    historyApiFallback: true,
-                    contentBase: '',
-                    port: 9383,
+        {
+            input: `${distPath}/scroll.js`,
+            output: {
+                format: 'esm',
+                file: `${distPath}/scroll.min.js`,
+            },
+            plugins: [
+                terser({
+                    compress: true,
+                    mangle: true,
                 }),
-        ],
-    },
-];
+                commandOptions.watch &&
+                    serve({
+                        open: true,
+                        historyApiFallback: true,
+                        contentBase: 'examples',
+                        port: 9383,
+                    }),
+            ],
+        },
+    ];
+}