├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── LICENSE.txt ├── assets ├── fonts │ ├── opensans-bold.woff2 │ ├── opensans-light.woff2 │ └── opensans-regular.woff2 └── img │ └── hero.jpg ├── package.json ├── readme.md ├── src ├── html │ └── index.pug ├── js │ ├── app.svelte │ ├── component │ │ ├── button-link.svelte │ │ ├── footer.svelte │ │ ├── hero.svelte │ │ ├── nav.svelte │ │ └── post.svelte │ ├── index.js │ ├── store │ │ ├── article.js │ │ └── site.js │ ├── utils.js │ └── view │ │ ├── 404.svelte │ │ ├── archive.svelte │ │ ├── article.svelte │ │ ├── articles.svelte │ │ ├── contact.svelte │ │ └── home.svelte └── scss │ ├── abstract │ ├── _function.scss │ ├── _mixin.scss │ └── _variable.scss │ ├── abstracts.scss │ ├── base.scss │ ├── base │ ├── _normalize.scss │ ├── _reset.scss │ └── _typography.scss │ ├── components │ ├── heading.scss │ └── keyline.scss │ └── layout │ ├── _general.scss │ ├── _grid.scss │ └── _vertical-spacing.scss ├── svelte.config.js └── webpack.config.js /.eslintignore: -------------------------------------------------------------------------------- 1 | # Lib 2 | dev/*.js 3 | dist/*.js -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | parser: 'babel-eslint', 3 | rules: { 4 | strict: 0, 5 | 'linebreak-style': ['error', 'unix'], 6 | }, 7 | plugins: [ 8 | 'svelte3', 9 | ], 10 | extends: ['google'] 11 | }; -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Compiled 2 | index.html 3 | dev 4 | publish/* 5 | 6 | # NPM, YARN 7 | node_modules 8 | yarn.lock 9 | yarn-error.log 10 | package-lock.json 11 | npm-debug.log 12 | 13 | # VS Code 14 | *.vscode 15 | *.code-workspace 16 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | Copyright 2019 David Horak 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy 4 | of this software and associated documentation files (the "Software"), to deal 5 | in the Software without restriction, including without limitation the rights 6 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 7 | copies of the Software, and to permit persons to whom the Software is 8 | furnished to do so, subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in all 11 | copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 19 | SOFTWARE. -------------------------------------------------------------------------------- /assets/fonts/opensans-bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/spaceavocado/svelte-router-template/dfdd4a8c53ed7e38922312f4353aaa943371f76a/assets/fonts/opensans-bold.woff2 -------------------------------------------------------------------------------- /assets/fonts/opensans-light.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/spaceavocado/svelte-router-template/dfdd4a8c53ed7e38922312f4353aaa943371f76a/assets/fonts/opensans-light.woff2 -------------------------------------------------------------------------------- /assets/fonts/opensans-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/spaceavocado/svelte-router-template/dfdd4a8c53ed7e38922312f4353aaa943371f76a/assets/fonts/opensans-regular.woff2 -------------------------------------------------------------------------------- /assets/img/hero.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/spaceavocado/svelte-router-template/dfdd4a8c53ed7e38922312f4353aaa943371f76a/assets/img/hero.jpg -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@spaceavocado/svelte-router-template", 3 | "version": "1.0.7", 4 | "description": "Boilerplate template project for spaceavocado/svelte-router - Simple Svelte Router for Single Page Applications (SPA).", 5 | "main": "src/js/index.js", 6 | "author": "David Horak ", 7 | "license": "MIT", 8 | "scripts": { 9 | "build:dev": "webpack --mode=development && npm run build:html:dev", 10 | "build:prod": "webpack --mode=production && npm run build:html:prod", 11 | "build:html:dev": "pug -P -o ./ -O \"{prod:false, baseURL:''}\" src/html/index.pug", 12 | "build:html:prod": "pug -P -o ./publish/ -O \"{prod:true, baseURL:''}\" src/html/index.pug", 13 | "start": "npm run build:html:dev && webpack-dev-server --mode=development --open" 14 | }, 15 | "repository": { 16 | "type": "git", 17 | "url": "git@github.com:spaceavocado/svelte-router-template.git" 18 | }, 19 | "bugs": { 20 | "url": "https://github.com/spaceavocado/svelte-router-template/issues" 21 | }, 22 | "homepage": "https://github.com/spaceavocado/svelte-router-template", 23 | "keywords": [ 24 | "svelte", 25 | "router", 26 | "svelte-router", 27 | "template" 28 | ], 29 | "devDependencies": { 30 | "@babel/core": "^7.6.4", 31 | "@babel/preset-env": "^7.6.3", 32 | "@spaceavocado/svelte-router": "^1.0.16", 33 | "babel-eslint": "^10.0.3", 34 | "babel-loader": "^8.0.6", 35 | "copy-webpack-plugin": "^5.0.4", 36 | "css-loader": "^3.2.0", 37 | "eslint": "^6.5.1", 38 | "eslint-config-google": "^0.14.0", 39 | "eslint-plugin-svelte3": "^2.7.3", 40 | "mini-css-extract-plugin": "^0.8.0", 41 | "node-sass": "^4.12.0", 42 | "optimize-css-assets-webpack-plugin": "^5.0.3", 43 | "pug": "^2.0.4", 44 | "sass-loader": "^8.0.0", 45 | "svelte": "^3.12.1", 46 | "svelte-loader": "^2.13.6", 47 | "svelte-preprocess": "^3.1.2", 48 | "terser-webpack-plugin": "^2.1.3", 49 | "webpack": "^4.38.0", 50 | "webpack-cli": "^3.3.9", 51 | "webpack-dev-server": "^3.8.2" 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | # Svelte Router Template 2 | 3 | Boilerplate template project for [spaceavocado/svelte-router](https://github.com/spaceavocado/svelte-router) - Simple Svelte Router for Single Page Applications (SPA). 4 | 5 | ## Live Preview 6 | [https://spaceavocado.github.io/svelte-router-template/](https://spaceavocado.github.io/svelte-router-template/) 7 | 8 | ## Setup 9 | 1. Clone this repository or [create your repository from this template](https://help.github.com/en/articles/creating-a-repository-from-a-template). 10 | 2. Install packages: 11 | ```npm install ``` or ```yarn install ``` 12 | 13 | ## Essential Information 14 | 15 | - [Webpack](https://webpack.js.org/) based project. 16 | - JS transpiled with [Babel](https://babeljs.io/). 17 | - SCSS for Svelte integrated with [Svelte Preprocess](https://github.com/kaisermann/svelte-preprocess), please see [svelte.config.js](https://github.com/spaceavocado/svelte-router-template/blob/master/svelte.config.js) for integration details. 18 | - [Pug](https://pugjs.org/) for Svelte integrated with [Svelte Preprocess](https://github.com/kaisermann/svelte-preprocess), please see the [Svelte Pug syntax limitations](https://github.com/kaisermann/svelte-preprocess#pug). 19 | - The template is set to use the Svelte Router HTML5 history mode, to switch it to HASH mode, please see the [Router Options](https://github.com/spaceavocado/svelte-router#router-options). 20 | ```javascript 21 | createRouter({ 22 | mode: ROUTER_MODE.HASH, 23 | }); 24 | ``` 25 | 26 | ## Local Development Server 27 | To run the development server that provides live reloading, run: 28 | ```npm run start``` or ```yarn start``` 29 | 30 | ## Production Build 31 | ```npm run build:prod``` or ```yarn build:prod``` 32 | 33 | > Note: If hosted in a sub-folder, e.g. domain.com/project/, please update the **baseURL** in: 34 | > * webpack.config.js 35 | > * package.json 36 | 37 | The productions files are located in **/publish** folder: 38 | 39 | - index.html 40 | - dist 41 | - assets 42 | 43 | ## License 44 | Svelte Router is released under the MIT license. See [LICENSE.txt](https://github.com/spaceavocado/svelte-router-template/blob/master/LICENSE.txt). -------------------------------------------------------------------------------- /src/html/index.pug: -------------------------------------------------------------------------------- 1 | doctype html 2 | html(lang='en') 3 | head 4 | meta(charset="utf-8") 5 | title Svelte Router Boilerplate Template 6 | meta(name="viewport" content="width=device-width, initial-scale=1") 7 | if prod 8 | link(rel="stylesheet" href=baseURL + "/dist/css/base.min.css") 9 | else 10 | link(rel="stylesheet" href=baseURL + "/dev/css/base.css") 11 | body 12 | if prod 13 | script(src=baseURL + "/dist/js/app.min.js") 14 | else 15 | script(src=baseURL + "/dev/js/app.js") -------------------------------------------------------------------------------- /src/js/app.svelte: -------------------------------------------------------------------------------- 1 | 79 | 80 |