experiments

All kinds of coding experiments
Log | Files | Refs | Submodules

README.md (3182B)

      1 *Looking for a shareable component template? Go here --> [sveltejs/component-template](https://github.com/sveltejs/component-template)*
      2 
      3 ---
      4 
      5 # svelte app
      6 
      7 This is a project template for [Svelte](https://svelte.dev) apps. It lives at https://github.com/sveltejs/template.
      8 
      9 To create a new project based on this template using [degit](https://github.com/Rich-Harris/degit):
     10 
     11 ```bash
     12 npx degit sveltejs/template svelte-app
     13 cd svelte-app
     14 ```
     15 
     16 *Note that you will need to have [Node.js](https://nodejs.org) installed.*
     17 
     18 
     19 ## Get started
     20 
     21 Install the dependencies...
     22 
     23 ```bash
     24 cd svelte-app
     25 npm install
     26 ```
     27 
     28 ...then start [Rollup](https://rollupjs.org):
     29 
     30 ```bash
     31 npm run dev
     32 ```
     33 
     34 Navigate to [localhost:5000](http://localhost:5000). You should see your app running. Edit a component file in `src`, save it, and reload the page to see your changes.
     35 
     36 By default, the server will only respond to requests from localhost. To allow connections from other computers, edit the `sirv` commands in package.json to include the option `--host 0.0.0.0`.
     37 
     38 If you're using [Visual Studio Code](https://code.visualstudio.com/) we recommend installing the official extension [Svelte for VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode). If you are using other editors you may need to install a plugin in order to get syntax highlighting and intellisense.
     39 
     40 ## Building and running in production mode
     41 
     42 To create an optimised version of the app:
     43 
     44 ```bash
     45 npm run build
     46 ```
     47 
     48 You can run the newly built app with `npm run start`. This uses [sirv](https://github.com/lukeed/sirv), which is included in your package.json's `dependencies` so that the app will work when you deploy to platforms like [Heroku](https://heroku.com).
     49 
     50 
     51 ## Single-page app mode
     52 
     53 By default, sirv will only respond to requests that match files in `public`. This is to maximise compatibility with static fileservers, allowing you to deploy your app anywhere.
     54 
     55 If you're building a single-page app (SPA) with multiple routes, sirv needs to be able to respond to requests for *any* path. You can make it so by editing the `"start"` command in package.json:
     56 
     57 ```js
     58 "start": "sirv public --single"
     59 ```
     60 
     61 ## Using TypeScript
     62 
     63 This template comes with a script to set up a TypeScript development environment, you can run it immediately after cloning the template with:
     64 
     65 ```bash
     66 node scripts/setupTypeScript.js
     67 ```
     68 
     69 Or remove the script via:
     70 
     71 ```bash
     72 rm scripts/setupTypeScript.js
     73 ```
     74 
     75 If you want to use `baseUrl` or `path` aliases within your `tsconfig`, you need to set up `@rollup/plugin-alias` to tell Rollup to resolve the aliases. For more info, see [this StackOverflow question](https://stackoverflow.com/questions/63427935/setup-tsconfig-path-in-svelte).
     76 
     77 ## Deploying to the web
     78 
     79 ### With [Vercel](https://vercel.com)
     80 
     81 Install `vercel` if you haven't already:
     82 
     83 ```bash
     84 npm install -g vercel
     85 ```
     86 
     87 Then, from within your project folder:
     88 
     89 ```bash
     90 cd public
     91 vercel deploy --name my-project
     92 ```
     93 
     94 ### With [surge](https://surge.sh/)
     95 
     96 Install `surge` if you haven't already:
     97 
     98 ```bash
     99 npm install -g surge
    100 ```
    101 
    102 Then, from within your project folder:
    103 
    104 ```bash
    105 npm run build
    106 surge public my-project.surge.sh
    107 ```