Skip to content

Commit 052c2b4

Browse files
authored
Merge pull request vuejs#79 from Alex-Sokolov/master
Новая секция про Nuxt.js + правки
2 parents a109974 + 3377185 commit 052c2b4

File tree

12 files changed

+27
-21
lines changed

12 files changed

+27
-21
lines changed

Makefile

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ deploy:
88
update:
99
cd ../vue && \
1010
git checkout -- dist && \
11-
git checkout dev && \
11+
git checkout master && \
1212
npm run build
1313
cp ../vue/dist/vue.min.js themes/vue/source/js/vue.min.js
1414
cp ../vue/dist/vue.js themes/vue/source/js/vue.js

README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
Этот репозиторий содержит [официальный перевод оригинальной документации vuejs.org на русский язык](https://ru.vuejs.org).
44

5-
Также переведена [документация vue-router](https://router.vuejs.org/ru/) и [vuex](https://vuex.vuejs.org/ru/).
5+
Также переведена [документация Vue-router](https://router.vuejs.org/ru/) и [Vuex](https://vuex.vuejs.org/ru/).
66

77
This is an official Russian translation branch of original vuejs.org repository.
88

@@ -17,7 +17,7 @@ $ npm install
1717
$ npm run server
1818
```
1919

20-
or
20+
or
2121

2222
```
2323
$ npm install -g hexo-cli

src/v2/api/index.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ type: api
6161
Vue.config.devtools = true
6262
```
6363

64-
Указывает, должен ли Vue позволять [vue-devtools](https://github.com/vuejs/vue-devtools) проводить инспекцию. Значение по умолчанию для development-окружения — `true`, для production-сборок — `false`. Установите `true`, чтобы vue-devtools работал и в production.
64+
Указывает, должен ли Vue позволять [Vue-devtools](https://github.com/vuejs/vue-devtools) проводить инспекцию. Значение по умолчанию для development-окружения — `true`, для production-сборок — `false`. Установите `true`, чтобы vue-devtools работал и в production.
6565

6666
### errorHandler
6767

@@ -809,7 +809,7 @@ type: api
809809

810810
Название компонента. Позволяет компоненту рекурсивно вызывать самого себя в шаблоне. Обратите внимание что когда компонент регистрируется глобально посредством `Vue.component()`, глобальный ID автоматически устанавливается равным его имени.
811811

812-
Кроме того, компоненты с указанным `name` проще отлаживать из-за более понятных сообщений в консоли. В [vue-devtools](https://github.com/vuejs/vue-devtools) все безымянные компоненты довольно неинформативно называются `<AnonymousComponent>`. Указание имён для компонентов значительно улучшает ситуацию.
812+
Кроме того, компоненты с указанным `name` проще отлаживать из-за более понятных сообщений в консоли. В [Vue-devtools](https://github.com/vuejs/vue-devtools) все безымянные компоненты довольно неинформативно называются `<AnonymousComponent>`. Указание имён для компонентов значительно улучшает ситуацию.
813813

814814
### extends
815815

src/v2/examples/hackernews.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ type: examples
44
order: 10
55
---
66

7-
> Это клон HackerNews, построенный на Firebase API, Vue 2.0 + vue-router + vuex, с использованием серверного рендеринга.
7+
> Это клон HackerNews, построенный на Firebase API, Vue 2.0 + Vue-router + Vuex, с использованием серверного рендеринга.
88
99
{% raw %}
1010
<div style="max-width:600px">
@@ -22,7 +22,7 @@ order: 10
2222
## Возможности
2323

2424
- Серверный рендеринг
25-
- Связка Vue + vue-router + vuex
25+
- Связка Vue + Vue-router + Vuex
2626
- Предварительное получение данных на сервере
2727
- Клиентское состояние и гидрация DOM
2828
- Использование однофайловых компонентов

src/v2/guide/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -340,7 +340,7 @@ var app7 = new Vue({
340340
</script>
341341
{% endraw %}
342342

343-
Конечно же, этот пример слегка надуман, но посмотрите сами — нам удалось разделить наше приложение на два меньших объекта, и дочерний оказался в разумной мере отвязан от родительского с помощью интерфейса входящих параметров. Теперь мы можем и далее улучшать наш компонент `<todo-item>`, усложняя шаблон и логику, но не влияя на родительское приложение.
343+
Конечно же, этот пример слегка надуман, но посмотрите сами — нам удалось разделить наше приложение на два меньших объекта, и дочерний оказался в разумной мере отвязан от родительского с помощью интерфейса входных параметров. Теперь мы можем и далее улучшать наш компонент `<todo-item>`, усложняя шаблон и логику, но не влияя на родительское приложение.
344344

345345
В крупных приложениях разделение на компоненты становится обязательным условием для сохранения управляемости процесса разработки. Разговор о компонентах ещё далеко не закончен и будет продолжен [далее в этом руководстве](components.html), но уже сейчас можно взглянуть на (вымышленный) пример того, как мог бы выглядеть шаблон приложения, использующего компоненты:
346346

src/v2/guide/join.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,9 @@ order: 30
2929

3030
После этого, вы будете готовы прислать код как в основные репозитории Vue:
3131

32-
- [vue](https://github.com/vuejs/vue): ядро фреймворка
33-
- [vuex](https://github.com/vuejs/vuex): Flux-подобная система управления состоянием
34-
- [vue-router](https://github.com/vuejs/vue-router): роутер для SPA
32+
- [Vue](https://github.com/vuejs/vue): ядро фреймворка
33+
- [Vuex](https://github.com/vuejs/vuex): Flux-подобная система управления состоянием
34+
- [Vue-router](https://github.com/vuejs/vue-router): роутер для SPA
3535

3636
...так и во множество небольших официальных [сопутствующих библиотек](https://github.com/vuejs).
3737

src/v2/guide/plugins.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@ order: 18
1212

1313
2. Добавляющие глобальные объекты: директивы/фильтры/переходы и т.д., например [vue-touch](https://github.com/vuejs/vue-touch)
1414

15-
3. Добавляющие опции компонентов посредством глобальной примеси, например [vuex](https://github.com/vuejs/vuex)
15+
3. Добавляющие опции компонентов посредством глобальной примеси, например [Vuex](https://github.com/vuejs/vuex)
1616

1717
4. Добавляющие методы инстанса Vue через Vue.prototype.
1818

19-
5. Библиотеки, предоставляющие собственные API, комбинируя вышеперечисленные возможности, например [vue-router](https://github.com/vuejs/vue-router)
19+
5. Библиотеки, предоставляющие собственные API, комбинируя вышеперечисленные возможности, например [Vue-router](https://github.com/vuejs/vue-router)
2020

2121
Плагин Vue.js должен содержать метод `install`. Метод будет вызван с конструктором `Vue` в качестве первого аргумента, и, возможно, с дополнительными опциями:
2222

src/v2/guide/reactivity.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ order: 12
1010

1111
Когда простой JavaScript-объект передаётся в инстанс Vue в качестве опции `data`, Vue обходит все его поля и превращает их в пары геттер/сеттер, используя [Object.defineProperty](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty). Эта возможность появилась в JavaScript только начиная с версии ES5, и в более ранних версиях её эмулировать не получится — по этой-то причине Vue и не поддерживает IE8 и ниже.
1212

13-
Геттеры и сеттеры не видны пользователю, но именно они являются тем внутренним механизмом, который позволяет Vue отслеживать зависимости и изменения данных. К сожалению, при таком подходе выведенные в консоль браузера геттеры и сеттеры выглядят не так, как обычные объекты, поэтому для более наглядной визуализации лучше использовать [инструменты разработчика vue-devtools](https://github.com/vuejs/vue-devtools).
13+
Геттеры и сеттеры не видны пользователю, но именно они являются тем внутренним механизмом, который позволяет Vue отслеживать зависимости и изменения данных. К сожалению, при таком подходе выведенные в консоль браузера геттеры и сеттеры выглядят не так, как обычные объекты, поэтому для более наглядной визуализации лучше использовать [инструменты разработчика Vue-devtools](https://github.com/vuejs/vue-devtools).
1414

1515
К каждому инстансу компонента приставлен связанный с ним **инстанс наблюдателя**, который помечает все поля, затронутые при рендеринге компонента, как зависимости. В дальнейшем, когда вызывается сеттер поля, помеченного как зависимость, этот сеттер уведомляет наблюдателя, который в свою очередь инициирует повторный рендеринг компонента.
1616

src/v2/guide/routing.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ order: 21
66

77
## Официальный роутер
88

9-
Для большинства одностраничных приложений (SPA) рекомендуется использовать официально поддерживаемую [библиотеку vue-router](https://github.com/vuejs/vue-router). Подробная информация по её использованию содержится в [документации библиотеки](http://vuejs.github.io/vue-router/).
9+
Для большинства одностраничных приложений (SPA) рекомендуется использовать официально поддерживаемую [библиотеку Vue-router](https://github.com/vuejs/vue-router). Подробная информация по её использованию содержится в [документации библиотеки](http://vuejs.github.io/vue-router/).
1010

1111
## Простой роутер с нуля
1212

src/v2/guide/ssr.md

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -274,7 +274,7 @@ server.get('*', function (request, response) {
274274

275275
SSR во Vue работает быстро, но можно ещё больше улучшить быстродействие, кешируя результаты рендеринга компонентов. Впрочем, важно понимать, что это — продвинутый механизм, поскольку кеширование неправильных компонентов (или правильных компонентов с неправильными ключами) может привести к ошибкам рендеринга приложения. В частном случае:
276276

277-
<p class="tip">Не следует кешировать компоненты, содержащие потомков, чьё состояние зависит от глобального (напр. от состояния vuex store). Если вы это сделаете, дочерние компоненты (а по сути — всё под-дерево целиком) тоже закешируются. Будьте особенно аккуратны с компонентами, принимающими слоты и/или дочерние компоненты.</p>
277+
<p class="tip">Не следует кешировать компоненты, содержащие потомков, чьё состояние зависит от глобального (напр. от состояния хранилища Vuex). Если вы это сделаете, дочерние компоненты (а по сути — всё под-дерево целиком) тоже закешируются. Будьте особенно аккуратны с компонентами, принимающими слоты и/или дочерние компоненты.</p>
278278

279279
### Настройка
280280

@@ -321,9 +321,15 @@ Vue.component({
321321

322322
## Процесс сборки, роутинг и гидрация состояния Vuex
323323

324-
К этому моменту вы должны понимать основы рендеринга на сервере. Однако, при добавлении процесса сборки, роутинга и vuex в картине появятся новые детали.
324+
К этому моменту вы должны понимать основы рендеринга на сервере. Однако, при добавлении процесса сборки, роутинга и Vuex в картине появятся новые детали.
325325

326326
Если вы хотите действительно хорошо разобраться в SSR сложных приложений, мы советуем ознакомиться со следующими ресурсами:
327327

328328
- [документация vue-server-renderer](https://www.npmjs.com/package/vue-server-renderer#api): более подробно о том, о чём мы уже здесь говорили, а также по более продвинутым темам, таким как [предотвращение cross-request-загрязнения](https://www.npmjs.com/package/vue-server-renderer#why-use-bundlerenderer) и [и добавление отдельной серверной сборки](https://www.npmjs.com/package/vue-server-renderer#creating-the-server-bundle)
329329
- [vue-hackernews-2.0](https://github.com/vuejs/vue-hackernews-2.0): подробный пример, объединяющий все основные библиотеки и концепции Vue в единое приложение
330+
331+
## Nuxt.js
332+
333+
Правильно настроить все аспекты приложения с рендерингом на стороне сервера и готовое к развёртыванию на production может быть сложной задачей. К счастью, есть отличный проект сообщества, который стремится сделать всё проще: [Nuxt.js](https://nuxtjs.org/).
334+
335+
Nuxt.js — это высокоуровневый фреймворк, построенный на экосистеме Vue, что обеспечит быстрое получение опыта разработки универсальных приложений на Vue. И даже лучше, вы можете использовать его в качестве генератора статических сайтов (со страницами представленными однофайловыми компонентами)! Мы настоятельно рекомендуем попробовать его.

0 commit comments

Comments
 (0)