[DONE][Just Merge Me][Community Translation] Russian Docs Translation

docs/LANGS.md

@@ -1,3 +1,4 @@
 * [English](en/)
-* [Português](pt/)
-* [한국어](kr/)
+* [한국어](kr/)
+* [Русский](ru/)
+* [Português](pt/)

docs/ru/README.md

@@ -0,0 +1,38 @@
+# Введение
+
+### Что такое `vue-loader`?
+
+`vue-loader` – это загрузчик для Webpack, который преобразует Vue компоненты, написанные в следующем формате в обычные JavaScript модули:
+
+![screenshot](http://blog.evanyou.me/images/vue-component.png)
+
+`vue-loader` предлагает множество полезных возможностей:
+
+- Поддержка ES2015 по умолчанию;
+- Позволяет использовать разные загрузчики Webpack для разных частей Vue компонента, например, SASS для `<style>` и Jade для `<template>`;
+- Позволяет использовать пользовательские секции во .vue-файлах, применяя к ним пользовательские цепочки загрузчиков
+- Обращается со статическими ресурсами, указанными в `<style>` и `<template>`, как с зависимостями модуля, и обрабатывает их Webpack загрузчиками;
+- Может эмулировать scoped CSS для компонентов;
+- Поддерживает горячую замену модулей.
+
+В двух словах, сочетание Webpack и `vue-loader` предоставляет вам современный, гибкий и невероятно эффективный подход к написанию клиентских приложений на Vue.js.
+
+### Что такое Webpack?
+
+Если вы уже знакомы с Webpack, можете пропустить дальнейшее объяснение. Для тех же, кому Webpack в новинку, вот краткая вводная:
+
+[Webpack](http://webpack.github.io/) – это сборщик модулей. Он берёт кучу файлов, рассматривая каждый как модуль, разрешает зависимости между ними и собирает их в статические ресурсы, готовые к развёртыванию.
+
+![webpack](http://webpack.github.io/assets/what-is-webpack.png)
+
+В качестве простого примера, представим, что у нас есть набор модулей CommonJS. Они не могут запускаться прямо в браузере, так что нам нужно "собрать" их в единый файл, который можно будет вставить на страницу через тег `<script>`. Webpack может сделать это за нас, следуя инструкциям `require()`.
+
+Но Webpack может делать и больше. С "загрузчиками", мы можем научить Webpack преобразовывать любые типы файлов любым нужным нам образом, прежде чем выдать финальную сборку. Например:
+
+- Скомпилировать ES2015, CoffeeScript или TypeScript модули в обычные ES5 CommonJS модули;
+- Пропустить код через статический анализатор, прежде чем приступать к компиляции;
+- Скомпилировать Jade шаблоны в обычный HTML и добавить его на страницу в виде строки JavaScript;
+- Скомпилировать SASS файлы в обычный CSS, затем конвертировать его в JS скрипт, который будет добавлять полученный CSS как тег `<style>`;
+- Обработать файлы изображений, указанные в HTML или CSS, переместить их в нужное место, согласно файлу конфигурации, и переименовать, используя их md5 хеш.
+
+Webpack настолько крут, что когда вы поймете, как он работает, он значительно улучшит ваш процесс разработки клиентской части. Его основным недостатком является многословная и сложная конфигурация; но с этим руководством вы сможете найти решения для большинства задач, возникающих при работе с Webpack в сочетании с Vue.js и `vue-loader`.

docs/ru/SUMMARY.md

@@ -0,0 +1,21 @@
+- Начало работы
+  - [Из чего состоит компонент Vue](start/spec.md)
+  - [Создание проекта](start/setup.md)
+- Возможности
+  - [ES2015](features/es2015.md)
+  - [Локальный CSS](features/scoped-css.md)
+  - [CSS модули](features/css-modules.md)
+  - [PostCSS](features/postcss.md)
+  - [Горячая замена](features/hot-reload.md)
+- Настройка
+  - [Пре-процессоры](configurations/pre-processors.md)
+  - [Обработка вложенных URL](configurations/asset-url.md)
+  - [Продвинутая конфигурация](configurations/advanced.md)
+  - [Извлечение CSS в файл](configurations/extract-css.md)
+  - [Пользовательские блоки](configurations/custom-blocks.md)
+- Workflow
+  - [Production Build](workflow/production.md)
+  - [Линтинг](workflow/linting.md)
+  - [Тестирование](workflow/testing.md)
+  - [Тестирование с моками](workflow/testing-with-mocks.md)
+- [Перечень настроек](options.md)

docs/ru/configurations/advanced.md

@@ -0,0 +1,82 @@
+# Продвинутая конфигурация vue-loader
+
+Иногда может потребоваться сделать:
+
+1. Применить пользовательский загрузчик (loader) к языку, вместо обработки его с помощью `vue-loader`;
+
+2. Переопределить встроенные настройки загрузчиков для языков по умолчанию.
+
+3. Добавить предварительную обработку или пост-обработку специфичной секции другим загрузчиком.
+
+Чтобы сделать это укажите опцию `loaders` для `vue-loader`:
+
+> Опции `preLoaders` и `postLoaders` доступны только в версиях >=10.3.0
+
+### Webpack 2.x
+
+``` js
+module.exports = {
+  // другие настройки...
+  module: {
+    // module.rules тоже самое, что и module.loaders в 1.x
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          // указанные `loaders` переопределят загрузчики используемые по умолчанию
+          // Конфигурация ниже будет обрабатывать все теги <script> без атрибута "lang"
+          // с помощью coffee-loader
+          loaders: {
+            js: 'coffee-loader'
+          },
+
+          // `preLoaders` будут применены перед стандартными загрузчиками.
+          // Вы можете использовать это для предварительной обработки секций
+          // часто используемая потребность для локализации на этапе сборки.
+          preLoaders: {
+            js: '/path/to/custom/loader'
+          },
+
+          // `postLoaders` будут применены после стандартных загрузчиков.
+          //
+          // - Для `html`, результат возвращаемый стандартным загрузчиком
+          //   будет скомпилированный в JavaScript код render-функции.
+          //
+          // - Для `css`, результат возвращаемый из vue-style-loader
+          //   что не является особенно полезным в большинстве случаев.
+          //   Использование postcss-плагина будет лучшим вариантом.
+          postLoaders: {
+            html: 'babel-loader'
+          }
+        }
+      }
+    ]
+  }
+}
+```
+
+### Webpack 1.x
+
+``` js
+// webpack.config.js
+module.exports = {
+  // другие настройки...
+  module: {
+    loaders: [
+      {
+        test: /\.vue$/,
+        loader: 'vue'
+      }
+    ]
+  },
+  // настройки vue-loader
+  vue: {
+    loaders: {
+      // такая же конфигурация правил как и выше
+    }
+  }
+}
+```
+
+Примером использования продвинутой конфигурации может быть например [извлечение CSS из компонентов в отдельный файл](./extract-css.md).

docs/ru/configurations/asset-url.md

@@ -0,0 +1,23 @@
+# Обработка вложенных URL
+
+По умолчанию `vue-loader` автоматически обрабатывает стили и файлы шаблонов с помощью [css-loader](https://github.com/webpack/css-loader) и компилятора шаблонов Vue. В процессе компиляции, все использованные URL, такие как `<img src="...">`, `background: url(...)` и CSS `@import` будут **обрабатаны как зависимости модуля**.
+
+Например, `url(./image.png)` будет преобразовано в `require('./image.png')`, а затем
+
+``` html
+<img src="../image.png">
+```
+
+будет скомпилировано в:
+
+``` js
+createElement('img', { attrs: { src: require('../image.png') }})
+```
+
+Так как `.png` это не JavaScript-файл, вам необходимо настроить Webpack использовать [file-loader](https://github.com/webpack/file-loader) или [url-loader](https://github.com/webpack/url-loader) для их обработки. Проект создаваемый с помощью `vue-cli` уже сделает это за вас.
+
+Преимущества подобного подхода:
+
+1. `file-loader` позволяет определить куда нужно скопировать и поместить файл, а также как именовать его с добавлением в имя хэша для лучшего кеширования. Кроме того, это означает что **вы можете просто поместить изображения рядом с вашим `*.vue` файлами и использовать относительные пути, основанные на структуре каталогов, не беспокоясь об адресах при развёртывании**. При правильной конфигурации, Webpack будет автоматически заменять пути к файлам в корректные URL в итоговой сборке.
+
+2. `url-loader` позволяет вставлять файлы как base-64 ссылки если они меньше указанного размера. Это позволит уменьшить количество HTTP-запросов при использовании маленьких файлов. Если же файл больше указанного порога, то он автоматически подключится с помощью `file-loader`.

docs/ru/configurations/custom-blocks.md

@@ -0,0 +1,67 @@
+# Пользовательские блоки
+
+> Доступно в версиях 10.2.0+
+
+Вы можете определять пользовательски блоки внутри `*.vue` файлов. Содержимое пользовательских блоков будет обрабатываться загрузчиками, указанными с объекте `loaders` настроек `vue-loader` и затем подключено модулем к компоненту. Конфигурация аналогична тому, что описано в разделе [продвинутой конфигурации загрузчиков](../configurations/advanced.md), за исключением совпадений по имени тега, вместо атрибута `lang`.
+
+Если подходящий загрузчик будет найден для пользовательского блока, он будет обработан; в противном случае пользовательский блок будет просто проигнорирован.
+
+## Пример
+
+Пример извлечения всех пользовательских блоков `<docs>` в отдельный файл документации:
+
+#### component.vue
+
+``` html
+<docs>
+## Это пример компонента.
+</docs>
+
+<template>
+  <h2 class="red">{{msg}}</h2>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      msg: 'Hello from Component A!'
+    }
+  }
+}
+</script>
+
+<style>
+comp-a h2 {
+  color: #f00;
+}
+</style>
+```
+
+#### webpack.config.js
+
+``` js
+// Webpack 2.x
+var ExtractTextPlugin = require("extract-text-webpack-plugin")
+
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue',
+        options: {
+          loaders: {
+            // извлечь всё содержимое тегов <docs> как обычный текст
+            'docs': ExtractTextPlugin.extract('raw-loader'),
+          }
+        }
+      }
+    ],
+    plugins: [
+      // вывести всю документацию в отдельный файл
+      new ExtractTextPlugin('docs.md')
+    ]
+  }
+}
+```

docs/ru/configurations/extract-css.md

@@ -0,0 +1,70 @@
+# Извлечение CSS в отдельный файл
+
+Пример конфигурации для извлечения CSS из всех компонентов Vue в отдельный CSS-файл:
+
+### Webpack 2.x
+
+``` bash
+npm install extract-text-webpack-plugin@2.x --save-dev
+```
+
+``` js
+// webpack.config.js
+var ExtractTextPlugin = require("extract-text-webpack-plugin")
+
+module.exports = {
+  // другие настройки...
+  module: {
+    rules: [
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          loaders: {
+            css: ExtractTextPlugin.extract({
+              use: 'css-loader',
+              fallback: 'vue-style-loader' // <- это внутренняя часть vue-loader, поэтому нет необходимости его устанавливать через NPM
+            })
+          }
+        }
+      },
+    ]
+  },
+  plugins: [
+    new ExtractTextPlugin("style.css")
+  ]
+}
+```
+
+### Webpack 1.x
+
+``` bash
+npm install extract-text-webpack-plugin --save-dev
+```
+
+``` js
+// webpack.config.js
+var ExtractTextPlugin = require("extract-text-webpack-plugin")
+
+module.exports = {
+  // другие настройки...
+  module: {
+    loaders: [
+      {
+        test: /\.vue$/,
+        loader: 'vue'
+      }
+    ]
+  },
+  vue: {
+    loaders: {
+      css: ExtractTextPlugin.extract("css"),
+      // вы также можете добавить <style lang="less"> или другие языки
+      less: ExtractTextPlugin.extract("css!less")
+    }
+  },
+  plugins: [
+    new ExtractTextPlugin("style.css")
+  ]
+}
+```

docs/ru/configurations/pre-processors.md

@@ -0,0 +1,81 @@
+# Использование пре-процессоров
+
+В Webpack все пре-процессоры должны быть применены с соответствующим загрузчиком. `vue-loader` позволяет вам использовать другие загрузчики Webpack для обработки секций компонентов Vue. Они будут автоматически вызваны для обработки секций на основе указанного атрибута `lang` у секции файла.
+
+### CSS
+
+Например, пусть в теге `<style>` будет использоваться SASS:
+
+``` bash
+npm install sass-loader node-sass --save-dev
+```
+
+``` html
+<style lang="sass">
+  /* используем SASS здесь */
+</style>
+```
+
+В недрах, текстовое содержимое тега `<style>` будет сперва скомпилировано с помощью `sass-loader` перед передачей для дальнейшей обработки.
+
+#### Особенность sass-loader
+
+Вопреки тому, что он называется [*sass*-loader](https://github.com/jtangelder/sass-loader), по умолчанию парсится синтаксис *SCSS*. Если вы на самом деле хотите использовать синтаксис *SASS* с отступами, вам требуется настроить vue-loader для sass-loader соответственно.
+
+```javascript
+{
+  test: /\.vue$/,
+  loader: 'vue-loader',
+  options: {
+    loaders: {
+      scss: 'vue-style-loader!css-loader!sass-loader' // <style lang="scss">
+      sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax' // <style lang="sass">
+    }
+  }
+}
+```
+
+Обратитесь к разделу [продвинутой конфигурации загрузчиков](./advanced.md) для получения дополнительной информации о том, как настраивать vue-loader.
+
+### JavaScript
+
+Весь JavaScript внутри Vue компонентов обрабатывается `babel-loader` по умолчанию. При необходимости это можно изменить:
+
+``` bash
+npm install coffee-loader --save-dev
+```
+
+``` html
+<script lang="coffee">
+  # Пишем на coffeescript!
+</script>
+```
+
+### Шаблоны
+
+Обработка шаблонов выполняется несколько иначе, потому что большинство loader'ов шаблонов Webpack, например `pug-loader`, возвращают функцию шаблона вместо скомпилированного в строку HTML. Поэтому вместо использования `pug-loader`, можно просто установить оригинальный `pug`:
+
+``` bash
+npm install pug --save-dev
+```
+
+``` html
+<template lang="pug">
+div
+  h1 Hello world!
+</template>
+```
+
+> **Внимание:** При использовании `vue-loader@<8.2.0`, вам также необходимо установить `template-html-loader`.
+
+### Непосредственное указание loader'ов
+
+Вы можете указывать [опции для loader'ов Webpack](https://webpack.github.io/docs/loaders.html#introduction) в атрибуте `lang`:
+
+``` html
+<style lang="sass?outputStyle=expanded">
+  /* используем SASS с расширенным выводом */
+</style>
+```
+
+Обратите внимание, это сделает ваш компонент Vue зависимым от Webpack и несовместимым с Browserify и [vueify](https://github.com/vuejs/vueify). **Если вы планируете распространять ваш компонент Vue, избегайте использования этого синтаксиса.**