Skip to content
This repository has been archived by the owner on Sep 3, 2024. It is now read-only.

Commit

Permalink
Merge pull request #3 from translation-gang/translation-ru
Browse files Browse the repository at this point in the history
[MERGEME] [Community Translation] Russian Translation | Русский Перевод
  • Loading branch information
atinux authored Jan 11, 2017
2 parents 26aac06 + 9a84ea0 commit 1bd55aa
Show file tree
Hide file tree
Showing 59 changed files with 3,520 additions and 0 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,3 +4,4 @@ node_modules

# logs
npm-debug.log
.DS_Store
4 changes: 4 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
Официальный русский перевод документации Nuxt.js (основная часть).

Russian translation of primary Nuxt.js documentation site. Supported by Translation Gang. Primary maintainer Grigoriy Beziuk.

# Nuxt.js Documentation

> This is where the documentation is stored and served as an API
Expand Down
34 changes: 34 additions & 0 deletions ru/api/configuration-build.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
---
title: Конфигурация BUILD
description: Nuxt.js позволяет конфигурировать опции webpack'а на ваше усмотрение.
---

# Build

> Nuxt.js позволяет конфигурировать опции webpack'а на ваше усмотрение.
## build.vendor

> Nuxt.js позволяет добавлять модули в генерируемый файл `vendor.bundle.js`, чтобы уменьшить размер финального приложения. Это действительно полезно при использовании внешних модулей (например, `axios`).
Для добавления стороннего модуля/файла внутрь приложения, создайте параметр `build.vendor` внутри `nuxt.config.js`:

```js
module.exports = {
build: {
vendor: ['axios']
}
}
```

Вы можете также указать путь к файлу, например, к своей собственной библиотеке:
```js
module.exports = {
build: {
vendor: [
'axios',
'~plugins/my-lib.js'
]
}
}
```
7 changes: 7 additions & 0 deletions ru/api/configuration-cache.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Конфигурация CACHE
---

# Cache

> Документация скоро будет
32 changes: 32 additions & 0 deletions ru/api/configuration-css.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
---
title: Конфигурация CSS
description: Nuxt.js позволяет указать глобальные CSS-файлы/модули/библиотеки (подключённые к каждой странице).
---

# CSS

> Nuxt.js позволяет указать глобальные CSS-файлы/модули/библиотеки (подключённые к каждой странице).
- Type: `Array`
- `String | Object`

Если элемент типа объект, то параметры следующие:
- src: `String` (путь к файлу)
- lang: `String` ([используется пре-процессор](/guide/pages#using-pre-processors))

В `nuxt.config.js` добавьте ресурсы CSS:

```js
module.exports = {
css: [
// Загрузить модуль node.js
'hover.css/css/hover-min.css',
// модуль node.js, но с указанием пре-процессора
{ src: 'bulma', lang: 'sass' },
// CSS-файл в проекте
'~assets/css/main.css'
]
}
```

<p class="Alert">**В продакшн-версии приложения** весь CSS-код будет минимизирован, скомпилирован в файл `styles.css` и добавлен в блок страницы `<head>`.</p>
7 changes: 7 additions & 0 deletions ru/api/configuration-env.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Конфигурация ENV
---

# Env

> Документация скоро будет
7 changes: 7 additions & 0 deletions ru/api/configuration-generate.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Configuration GENERATE
---

# Generate

> Документация скоро будет
7 changes: 7 additions & 0 deletions ru/api/configuration-head.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Конфигурация HEAD
---

# Head

> Документация скоро будет
7 changes: 7 additions & 0 deletions ru/api/configuration-loading.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Конфигурация LOADING
---

# Loading

> Документация скоро будет
7 changes: 7 additions & 0 deletions ru/api/configuration-plugins.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Конфигурация PLUGINS
---

# Plugins

> Документация скоро будет
7 changes: 7 additions & 0 deletions ru/api/configuration-router.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Конфигурация ROUTER
---

# Router

> Документация скоро будет
27 changes: 27 additions & 0 deletions ru/api/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
---
title: Модуль Nuxt.js
description: можно использовать nuxt.js программно, как middleware для собственного web-сервера.
---

# Программное использование Nuxt.js

Вероятно, вы захотите использовать свой сервер со своим ПО и API. Для этого вы можете использовать Nuxt.js программно.
Nuxt.js написан на ES2015, из-за чего его код приятен и хорошо читаем. Транспилеры не используются, и всю работу выполняет сам движок Core V8. Поэтому Nuxt.js требует Node.js версии `4.0` или выше.

Подключить Nuxt.js можно так:
```js
const Nuxt = require('nuxt')
```

### Опции Nuxt

Чтобы узнать о возможных опциях для Nuxt.js, см. раздел конфигурации.
```js
const options = {}

const nuxt = new Nuxt(options)
nuxt.build()
.then(() => {
// Здесь можно использовать nuxt.render(req, res) или nuxt.renderRoute(route, context)
})
```
31 changes: 31 additions & 0 deletions ru/api/menu.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
[
{
"title": "Модуль Nuxt",
"links": [
{ "name": "Использование", "to": "" },
{ "name": "Render", "to": "/nuxt-render" },
{ "name": "RenderRoute", "to": "/nuxt-render-route" },
{ "name": "RenderAndGetWindow", "to": "/nuxt-render-and-get-window" }
]
},
{
"title": "Конфигурация",
"links": [
{ "name": "Build", "to": "/configuration-build" },
{ "name": "Cache", "to": "/configuration-cache" },
{ "name": "CSS", "to": "/configuration-css" },
{ "name": "Env", "to": "/configuration-env" },
{ "name": "Generate", "to": "/configuration-generate" },
{ "name": "Head", "to": "/configuration-head" },
{ "name": "Loading", "to": "/configuration-loading" },
{ "name": "Plugins", "to": "/configuration-plugins" },
{ "name": "Router", "to": "/configuration-router" }
]
},
{
"title": "Страницы",
"links": [
{ "name": "Контекст (Context)", "to": "/pages-context" }
]
}
]
7 changes: 7 additions & 0 deletions ru/api/nuxt-render-and-get-window.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Модуль Nuxt.js
---

# nuxt.renderAndGetWindow()

> Документация скоро будет
7 changes: 7 additions & 0 deletions ru/api/nuxt-render-route.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
title: Модуль Nuxt.js
---

# nuxt.renderRoute()

> Документация скоро будет
24 changes: 24 additions & 0 deletions ru/api/nuxt-render.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
---
title: Модуль Nuxt.js
---

# nuxt.render(req, res)

Вы можете использовать Nuxt.js с помощью `nuxt.render` для сервера node.js.

Пример с Express.js:
```js
const app = require('express')()
const Nuxt = require('nuxt')

const nuxt = new Nuxt()
nuxt.build()
.then(() => {
// Рендерить каждый маршрут с Nuxt.js
app.use(nuxt.render)
// Запустить сервер
app.listen(3000)
})
```

<p class="Alert">Рекомендуется вызываать **nuxt.render** в конце выполнения вашего кода, поскольку фреймворк отвечает за рендеринг вашего веб-приложения и не будет вызывать next()</p>
23 changes: 23 additions & 0 deletions ru/api/pages-context.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
---
title: Контекст страниц
description: Контекст (context) — полезный объект с набором методов для абстракции клиент-серверного взаимодействия.
---

# Контекст

Список доступных ключей в свойстве `context`:

| Ключ | Тип | Доступность | Описание |
|-----|------|--------------|-------------|
| `isClient` | Булевское | Клиент & сервер | Значение `true` указывает на то, что рендеринг происходит на стороне клиента. |
| `isServer` | Булевское | Клиент & сервер | Значение `true` указывает на то, что рендеринг происходит на стороне сервера. |
| `isDev` | Булевское | Клиент & сервер | Значение `true` указывает на то, что код выполняется в режиме разработки. Может быть полезно, когда необходимо кешировать данные в продакшн-версии. |
| `route` | [Маршрут Vue](https://router.vuejs.org/en/api/route-object.html) | Клиент & сервер | экземпляр класса маршрута в `vue-router` [см. документацию](https://router.vuejs.org/en/api/route-object.html) |
| `store` | [Хранилище Vuex](http://vuex.vuejs.org/en/api.html#vuexstore-instance-properties) | Клиент & сервер | Экземпляр `Vuex.Store`. **Доступен только в случае, когда `store: true` в `nuxt.config.js`** |
| `env` | Объект | Клиент & сервер | Переменная окружения в `nuxt.config.js`, [см. API окружения](/api/configuration-env) |
| `params` | Объект | Клиент & сервер | Псевдоним route.params |
| `query` | Объект | Клиент & сервер | Псевдоним route.query |
| `req` | [http.Request](https://nodejs.org/api/http.html#http_class_http_incomingmessage) | Сервер | Запрос от сервера node.js. Если nuxt используется в качестве промежуточного ПО, то объект `req` может отличаться в зависимости от выбранного фреймворка. *Не доступен через `nuxt generate`*. |
| `res` | [http.Response](https://nodejs.org/api/http.html#http_class_http_serverresponse) | Сервер | Ответ от сервера node.js. Если nuxt используется в качестве промежуточного ПО, то объект `res` может отличаться в зависимости от выбранного фреймворка. *Не доступен через `nuxt generate`*. |
| `redirect` | Функция | Клиент & сервер | Используйте этот метод, чтобы перенаправить юзерана другой маршрут. Значение статуса запроса (status) используется на сервере, по-умолчанию — 302. `redirect([status,] path [, query])` |
| `error` | Функция | Клиент & сервер | Используйте этот метод, чтобы показать страницу ошибки: `error(params)`. Объект `params`должен содержать свойства `statusCode` и `message`. |
102 changes: 102 additions & 0 deletions ru/examples/async-datas.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
---
title: Async Datas
description: Async Datas example with Nuxt.js
github: async-data
---

## Documentation

### data (context)

> Nuxt.js *supercharges* the `data` method from vue.js to let you handle async operation before setting the component data.
`data` is called every time before loading the component (*only if attached to a route*). It can be called from the server-side or before navigating to the corresponding route.

The `data` method receives the context as the first argument, you can use it to fetch some data and return the component data. To make the data method asynchronous, Nuxt.js offers you 2 ways, choose the one you're the most familiar with:

1. returning a `Promise`, Nuxt.js will wait for the promise to be resolved before rendering the Component
2. Define a second argument which is a callback method to be called like this: `callback(err, data)`

Example with returning a `Promise`:
```js
export default {
data ({ params }) {
return axios.get(`https://my-api/posts/${params.id}`)
.then((res) => {
return { title: res.data.title }
})
}
}
```

Example with using the `callback` argument:
```js
export default {
data ({ params }, callback) {
axios.get(`https://my-api/posts/${params.id}`)
.then((res) => {
callback(null, { title: res.data.title })
})
}
}
```

And then, you can display the data inside your template:

```html
<template>
<h1>{{ title }}</h1>
</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 |
| `isDev` | Boolean | Client & Server | Boolean to let you know if you're in dev mode, can be useful for caching some data in production |
| `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. |
| `redirect` | Function | Client & Server | Use this method to redirect the user to another route, the status code is used on the server-side, default to 302. `redirect([status,] path [, query])` |
| `error` | Function | Client & Server | Use this method to show the error page: `error(params)`. The `params` should have the fields `statusCode` and `message`. |

### Handling errors

Nuxt.js add the `error(params)` method in the `context`, you can call it to display the error page. `params.statusCode` will be also used to render the proper status code form the server-side.

Example with a `Promise`:
```js
export default {
data ({ params, error }) {
return axios.get(`https://my-api/posts/${params.id}`)
.then((res) => {
return { title: res.data.title }
})
.catch((e) => {
error({ statusCode: 404, message: 'Post not found' })
})
}
}
```

If you're using the `callback` argument, you can call it directly with the error, Nuxt.js will call the `error` method for you:
```js
export default {
data ({ params }, callback) {
axios.get(`https://my-api/posts/${params.id}`)
.then((res) => {
callback(null, { title: res.data.title })
})
.catch((e) => {
callback({ statusCode: 404, message: 'Post not found' })
})
}
}
```
Loading

0 comments on commit 1bd55aa

Please sign in to comment.