diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000000..647ea035d9 --- /dev/null +++ b/.npmignore @@ -0,0 +1,2 @@ +# Excludes examples +examples diff --git a/examples/async-data/README.md b/examples/async-data/README.md index e2f4bd15bd..62a4db2db2 100644 --- a/examples/async-data/README.md +++ b/examples/async-data/README.md @@ -28,6 +28,21 @@ And then, you can display the data inside your template: ``` +## Context + +List of all the available keys in `context`: + +| Key | Type | Available | Description | +|-----|------|--------------|-------------| +| `isClient` | Boolean | Client & Server | Boolean to let you know if you're actually renderer from the client-side | +| `isServer` | Boolean | Client & Server | Boolean to let you know if you're actually renderer from the server-side | +| `route` | [vue-router route](https://router.vuejs.org/en/api/route-object.html) | Client & Server | `vue-router` route instance [see documentation](https://router.vuejs.org/en/api/route-object.html) | +| `store` | [vuex store](http://vuex.vuejs.org/en/api.html#vuexstore-instance-properties) | Client & Server | `Vuex.Store` instance. **Available only if `store: true` is set in `nuxt.config.js`** | +| `params` | Object | Client & Server | Alias of route.params | +| `query` | Object | Client & Server | Alias of route.query | +| `req` | [http.Request](https://nodejs.org/api/http.html#http_class_http_incomingmessage) | Server | Request from the node.js server. If nuxt is used as a middleware, the req object might be different depending of the framework you're using. | +| `res` | [http.Response](https://nodejs.org/api/http.html#http_class_http_serverresponse) | Server | Response from the node.js server. If nuxt is used as a middleware, the res object might be different depending of the framework you're using. | + ## Demo ```bash diff --git a/examples/custom-routes/README.md b/examples/custom-routes/README.md new file mode 100644 index 0000000000..a7804d3f52 --- /dev/null +++ b/examples/custom-routes/README.md @@ -0,0 +1,44 @@ +# Defining custom routes with Nuxt.js + +> Nuxt.js is based on vue-router and allows you to defined custom routes :rocket: + +## Usage + +Add your custom routes inside `nuxt.config.js`: +```js +module.exports = { + routes: [ + { path: '/users/:id', component: 'pages/user' } + ] +} +``` + +| key | Optional? | definition | +|------|------------| +| `path` | **Required** | Route path, it can have dynamic mapping, look at [vue-router documentation](https://router.vuejs.org/en/essentials/dynamic-matching.html) about it. | +| `component` | **Required** | Path to the `.vue` component, if relative, it has to be from the app folder. | +| `name` | Optional | Route name, useful for linking to it with ``, see [vue-router documentation](https://router.vuejs.org/en/essentials/named-routes.html) about it. | +| `meta` | Optional | Let you add custom fields to get back inside your component (available in the context via `route.meta` inside `data` and `fetch` methods). See [vue-router documentation](https://router.vuejs.org/en/advanced/meta.html) about it. | +| `children` | Optional | *Not supported* | + +## Hidden pages + +>If you want don't want nuxt.js to generate a route for a specific page, you just have to **rename it with _ at the beginning**. + +Let's say I have a component `pages/user.vue` and I don't want nuxt.js to create the `/user`. I can rename it to `pages/_user.vue` and voilĂ ! + +You can then change the component path in the `nuxt.config.js`: +```js +// ... + { path: '/users/:id', component: 'pages/_user' } +// ... +``` + +## Demo + +```bash +npm install +npm start +``` + +Go to [http://localhost:3000](http://localhost:3000) and navigate through the pages. diff --git a/lib/app/router.js b/lib/app/router.js index dcf3b5feed..2812bb4df9 100644 --- a/lib/app/router.js +++ b/lib/app/router.js @@ -32,7 +32,8 @@ export default new Router({ { path: '<%= route.path %>', component: <%= route._name %><% if (route.name) { %>, - name: '<%= route.name %>'<% } %> + name: '<%= route.name %>'<% } %><% if (route.meta) { %>, + meta: <%= JSON.stringify(route.meta) %><% } %> }<%= (i + 1 === routes.length ? '' : ',') %> <% }) %> ]