docs: make SvelteKit/Vite config examples more concise (#225)

* chore(examples): bump deps

* docs: brevity and capitalization

* docs: only use one example

Author: metonym

CHANGELOG.md

@@ -50,7 +50,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [5.3.2](https://github.com/metonym/svelte-highlight/releases/tag/v5.3.2) - 2022-03-16
 
-- specify in docs that vite should optimize both "highlight.js" and "highlight.js/lib/core" if using SvelteKit or vite
+- specify in docs that Vite should optimize both "highlight.js" and "highlight.js/lib/core" if using SvelteKit or Vite
 
 ## [5.3.1](https://github.com/metonym/svelte-highlight/releases/tag/v5.3.1) - 2022-03-16
 

README.md

@@ -26,50 +26,28 @@ Note that [pnpm](https://github.com/pnpm/pnpm) users must also install `highligh
 
 ## SvelteKit Set-up
 
-To use this library with [SvelteKit](https://github.com/sveltejs/kit) or [vite](https://github.com/sveltejs/vite-plugin-svelte), instruct vite to optimize `highlight.js` and `highlight.js/lib/core`:
+To use this library with [SvelteKit](https://github.com/sveltejs/kit) or [Vite](https://github.com/sveltejs/vite-plugin-svelte), instruct Vite to [optimize](https://vitejs.dev/config/dep-optimization-options.html#optimizedeps-include) `highlight.js` and `highlight.js/lib/core`:
 
 ```diff
 + optimizeDeps: {
 +   include: ["highlight.js", "highlight.js/lib/core"],
 + },
 ```
 
-As of [SvelteKit version 1.0.0-next.359](https://github.com/sveltejs/kit/releases/tag/%40sveltejs/kit%401.0.0-next.359), `vite` options are defined in `vite.config.js`.
-
 **vite.config.js**
 
 ```js
 import { sveltekit } from "@sveltejs/kit/vite";
 
 /** @type {import('vite').UserConfig} */
-const config = {
+export default {
   plugins: [sveltekit()],
   optimizeDeps: {
     include: ["highlight.js", "highlight.js/lib/core"],
   },
 };
-
-export default config;
-```
-
-<details>
-  <summary>SvelteKit <=1.0.0-next.358</summary>
-
-```js
-// svelte.config.js
-export default {
-  kit: {
-    vite: {
-      optimizeDeps: {
-        include: ["highlight.js", "highlight.js/lib/core"],
-      },
-    },
-  },
-};
 ```
 
-</details>
-
 Refer to [examples/sveltekit](examples/sveltekit) or [examples/vite](examples/vite).
 
 ## Usage

demo/routes/index.svelte

@@ -80,11 +80,11 @@
 <Row class="mb-7">
   <Column xlg={9} lg={12}>
     <p class="mb-5">
-      To use this library with SvelteKit or vite, add <code class="code"
+      To use this library with SvelteKit or Vite, add <code class="code"
         >"highlight.js"</code
       >
       and <code class="code">"highlight.js/lib/core"</code>
-      to the dependencies for vite to optimize.
+      to the dependencies for Vite to optimize.
     </p>
 
     <h5 class="mb-5">vite.config.js</h5>
@@ -309,14 +309,15 @@
   <Column xlg={9} lg={12}>
     <h3 class="mb-7">Examples</h3>
     <p class="mb-5">
-      Example set-ups – including SvelteKit, Rollup, Webpack, and Snowpack – are
-      located in the
+      Example set-ups – including SvelteKit, Vite, Rollup, Webpack, and Snowpack
+      – are located in the
       <Link
         inline
         size="lg"
         href="https://github.com/metonym/svelte-highlight/tree/master/examples"
-        >examples folder in the GitHub repository</Link
-      >.
+      >
+        examples folder in the GitHub repository
+      </Link>.
     </p>
   </Column>
 </Row>

examples/rollup-typescript/package.json

@@ -10,7 +10,7 @@
     "@rollup/plugin-node-resolve": "^13.3.0",
     "@rollup/plugin-typescript": "^8.3.3",
     "@tsconfig/svelte": "^3.0.0",
-    "rollup": "^2.76.0",
+    "rollup": "^2.77.0",
     "rollup-plugin-svelte": "^7.0.0",
     "rollup-plugin-terser": "^7.0.2",
     "svelte": "^3.49.0",

examples/rollup-typescript/yarn.lock

@@ -655,10 +655,10 @@ rollup-pluginutils@^2.8.2:
   dependencies:
     estree-walker "^0.6.1"
 
-rollup@^2.76.0:
-  version "2.76.0"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.76.0.tgz#c69fe03db530ac53fcb9523b3caa0d3c0b9491a1"
-  integrity sha512-9jwRIEY1jOzKLj3nsY/yot41r19ITdQrhs+q3ggNWhr9TQgduHqANvPpS32RNpzGklJu3G1AJfvlZLi/6wFgWA==
+rollup@^2.77.0:
+  version "2.77.0"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.77.0.tgz#749eaa5ac09b6baa52acc076bc46613eddfd53f4"
+  integrity sha512-vL8xjY4yOQEw79DvyXLijhnhh+R/O9zpF/LEgkCebZFtb6ELeN9H3/2T0r8+mp+fFTBHZ5qGpOpW2ela2zRt3g==
   optionalDependencies:
     fsevents "~2.3.2"
 

examples/rollup/package.json

@@ -7,7 +7,7 @@
   "devDependencies": {
     "@rollup/plugin-commonjs": "^22.0.1",
     "@rollup/plugin-node-resolve": "^13.3.0",
-    "rollup": "^2.76.0",
+    "rollup": "^2.77.0",
     "rollup-plugin-svelte": "^7.1.0",
     "rollup-plugin-terser": "^7.0.2",
     "svelte": "^3.49.0",

examples/rollup/yarn.lock

@@ -403,10 +403,10 @@ rollup-pluginutils@^2.8.2:
   dependencies:
     estree-walker "^0.6.1"
 
-rollup@^2.76.0:
-  version "2.76.0"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.76.0.tgz#c69fe03db530ac53fcb9523b3caa0d3c0b9491a1"
-  integrity sha512-9jwRIEY1jOzKLj3nsY/yot41r19ITdQrhs+q3ggNWhr9TQgduHqANvPpS32RNpzGklJu3G1AJfvlZLi/6wFgWA==
+rollup@^2.77.0:
+  version "2.77.0"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.77.0.tgz#749eaa5ac09b6baa52acc076bc46613eddfd53f4"
+  integrity sha512-vL8xjY4yOQEw79DvyXLijhnhh+R/O9zpF/LEgkCebZFtb6ELeN9H3/2T0r8+mp+fFTBHZ5qGpOpW2ela2zRt3g==
   optionalDependencies:
     fsevents "~2.3.2"
 

examples/snowpack/README.md

@@ -1,6 +1,6 @@
 # examples/snowpack
 
-> `svelte-highlight` snowpack set-up.
+> `svelte-highlight` Snowpack set-up.
 
 ## Available Scripts
 

examples/sveltekit/.gitignore

@@ -1,5 +1,4 @@
 .DS_Store
 node_modules
-/.svelte-kit
-/build
-/functions
+.svelte-kit
+build

examples/sveltekit/README.md

@@ -11,3 +11,7 @@ Runs the project in development mode and watches for any changes.
 ### `yarn build`
 
 Builds the project for production.
+
+### `yarn preview`
+
+Preview the app locally. Run `yarn build` first.