totole/sapper
1
0
Fork 0
mirror of https://github.com/kevin-DL/sapper.git synced 2026-01-16 21:04:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

update docs

Browse Source
This commit is contained in:
Rich Harris
2019-04-30 12:10:53 -04:00
parent bca88831da
commit dc73973d44
13 changed files with 175 additions and 229 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
site/content/docs/01-structure.md
View File

@@ -11,8 +11,8 @@ If you take a look inside the [sapper-template](https://github.com/sveltejs/sapp
├ src
│ ├ routes
│ │ ├ # your routes here
│ │ ├ _error.html
│ │ └ index.html
│ │ ├ _error.svelte
│ │ └ index.svelte
│ ├ client.js
│ ├ server.js
│ ├ service-worker.js
@@ -24,9 +24,9 @@ If you take a look inside the [sapper-template](https://github.com/sveltejs/sapp
When you first run Sapper, it will create an additional `__sapper__` directory containing generated files.
You'll notice a few extra files and a `cypress` directory which relates to [testing](guide#testing) — we don't need to worry about those right now.
You'll notice a few extra files and a `cypress` directory which relates to [testing](docs#testing) — we don't need to worry about those right now.
> You *can* create these files from scratch, but it's much better to use the template. See [getting started](guide#getting-started) for instructions on how to easily clone it
> You *can* create these files from scratch, but it's much better to use the template. See [getting started](docs#getting-started) for instructions on how to easily clone it
### package.json
@@ -35,9 +35,9 @@ Your package.json contains your app's dependencies and defines a number of scrip
* `npm run dev` — start the app in development mode, and watch source files for changes
* `npm run build` — build the app in production mode
* `npm run export` — bake out a static version, if applicable (see [exporting](guide#exporting))
* `npm run export` — bake out a static version, if applicable (see [exporting](docs#exporting))
* `npm start` — start the app in production mode after you've built it
* `npm test` — run the tests (see [testing](guide#testing))
* `npm test` — run the tests (see [testing](docs#testing))
### src
@@ -46,17 +46,17 @@ This contains the three *entry points* for your app — `src/client.js`, `src/se
#### src/client.js
This *must* import, and call, the `start` function from the generated `__sapper__/client.js` file:
This *must* import, and call, the `start` function from the generated `@sapper/app` module:
```js
import * as sapper from '../__sapper__/client.js';
import * as sapper from '@sapper/app';
sapper.start({
target: document.querySelector('#sapper')
});
```
In many cases, that's the entirety of your entry module, though you can do as much or as little here as you wish. See the [client API](guide#client-api) section for more information on functions you can import.
In many cases, that's the entirety of your entry module, though you can do as much or as little here as you wish. See the [client API](docs#client-api) section for more information on functions you can import.
#### src/server.js
@@ -64,7 +64,7 @@ In many cases, that's the entirety of your entry module, though you can do as mu
This is a normal Express (or [Polka](https://github.com/lukeed/polka), etc) app, with three requirements:
* it should serve the contents of the `static` folder, using for example [sirv](https://github.com/lukeed/sirv)
* it should call `app.use(sapper.middleware())` at the end, where `sapper` is imported from `../__sapper__/server.js`
* it should call `app.use(sapper.middleware())` at the end, where `sapper` is imported from `@sapper/server`
* it must listen on `process.env.PORT`
Beyond that, you can write the server however you like.
@@ -76,7 +76,7 @@ Service workers act as proxy servers that give you fine-grained control over how
Among other things, this makes it possible to build applications that work offline.
Because every app needs a slightly different service worker (sometimes it's appropriate to always serve from the cache, sometimes that should only be a last resort in case of no connectivity), Sapper doesn't attempt to control the service worker. Instead, you write the logic in `service-worker.js`. You can import any of the following from `../__sapper__/service-worker.js`:
Because every app needs a slightly different service worker (sometimes it's appropriate to always serve from the cache, sometimes that should only be a last resort in case of no connectivity), Sapper doesn't attempt to control the service worker. Instead, you write the logic in `service-worker.js`. You can import any of the following from `@sapper/service-worker`:
* `files` — an array of files found in the `static` directory
* `shell` — the client-side JavaScript generated by the bundler (Rollup or webpack)
@@ -88,7 +88,7 @@ Because every app needs a slightly different service worker (sometimes it's appr
This file is a template for responses from the server. Sapper will inject content that replaces the following tags:
* `%sapper.base%` — a `<base>` element (see [base URLs](guide#base-urls))
* `%sapper.base%` — a `<base>` element (see [base URLs](docs#base-urls))
* `%sapper.styles%` — critical CSS for the page being requested
* `%sapper.head%` — HTML representing page-specific `<head>` contents, like `<title>`
* `%sapper.html%` — HTML representing the body of the page being rendered
@@ -97,14 +97,14 @@ This file is a template for responses from the server. Sapper will inject conten
### src/routes
This is the meat of your app — the pages and server routes. See the section on [routing](guide#routing) for the juicy details.
This is the meat of your app — the pages and server routes. See the section on [routing](docs#routing) for the juicy details.
### static
This is a place to put any files that your app uses — fonts, images and so on. For example `static/favicon.png` will be served as `/favicon.png`.
Sapper doesn't serve these files — you'd typically use [sirv](https://github.com/lukeed/sirv) or [serve-static](https://github.com/expressjs/serve-static) for that — but it will read the contents of the `static` folder so that you can easily generate a cache manifest for offline support (see [service-worker.js](guide#templates-service-worker-js)).
Sapper doesn't serve these files — you'd typically use [sirv](https://github.com/lukeed/sirv) or [serve-static](https://github.com/expressjs/serve-static) for that — but it will read the contents of the `static` folder so that you can easily generate a cache manifest for offline support (see [service-worker.js](docs#templates-service-worker-js)).
### rollup.config.js / webpack.config.js