Merge pull request vuejs#115 from Alex-Sokolov/master

Смена ссылок на сайт Webpack + пара правок

Author: gbezyuk

src/v2/guide/components.md

@@ -1002,7 +1002,7 @@ Vue.component('async-example', function (resolve, reject) {
 })
 ```
 
-Функция-фабрика принимает параметр `resolve` — коллбэк, который вызывается после того, как определение компонента получено от сервера. Кроме того, можно вызвать `reject(reason)`, если загрузка по какой-либо причине не удалась. Мы используем `setTimeout` исключительно в демонстрационных целях; как именно получать компонент в реальной ситуации — решать только вам самим. Один из удачных подходов — это использовать асинхронные компоненты в связке с [функциями Webpack по разделению кода](http://webpack.github.io/docs/code-splitting.html):
+Функция-фабрика принимает параметр `resolve` — коллбэк, который вызывается после того, как определение компонента получено от сервера. Кроме того, можно вызвать `reject(reason)`, если загрузка по какой-либо причине не удалась. Мы используем `setTimeout` исключительно в демонстрационных целях; как именно получать компонент в реальной ситуации — решать только вам самим. Один из удачных подходов — это использовать асинхронные компоненты в связке с [функциями Webpack по разделению кода](https://webpack.js.org/guides/code-splitting-require/):
 
 ``` js
 Vue.component('async-webpack-example', function (resolve) {

src/v2/guide/deployment.md

@@ -18,7 +18,7 @@ order: 20
 
 #### Webpack
 
-Используйте плагин Webpack [DefinePlugin](http://webpack.github.io/docs/list-of-plugins.html#defineplugin) для установки переменных окружения. Это позволит UglifyJS на этапе сборки удалить все предупреждения. Пример конфигурации:
+Используйте плагин Webpack [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) для установки переменных окружения. Это позволит UglifyJS на этапе сборки удалить все предупреждения. Пример конфигурации:
 
 ``` js
 var webpack = require('webpack')

src/v2/guide/installation.md

@@ -37,7 +37,7 @@ Vue также доступен на [jsdelivr](//cdn.jsdelivr.net/vue/{{vue_ver
 
 ## NPM
 
-Рекомендуем использовать NPM при создании крупных приложений на Vue. Этот вариант прекрасно работает в паре с инструментами сборки, такими как [Webpack](http://webpack.github.io/) и [Browserify](http://browserify.org/). Во Vue также есть совместимые с ними инструменты для использования [однофайловых компонентов](single-file-components.html).
+Рекомендуем использовать NPM при создании крупных приложений на Vue. Этот вариант прекрасно работает в паре с инструментами сборки, такими как [Webpack](https://webpack.js.org/) и [Browserify](http://browserify.org/). Во Vue также есть совместимые с ними инструменты для использования [однофайловых компонентов](single-file-components.html).
 
 ``` bash
 # последняя стабильная версия

src/v2/guide/single-file-components.md

@@ -24,16 +24,29 @@ order: 19
 Мы получили:
 
 - [полную подсветку синтаксиса](https://github.com/vuejs/awesome-vue#syntax-highlighting)
-- [модули CommonJS](https://webpack.github.io/docs/commonjs.html)
+- [модули CommonJS](https://webpack.js.org/concepts/modules/#what-is-a-webpack-module)
 - [модульный CSS](https://github.com/vuejs/vue-loader/blob/master/docs/en/features/scoped-css.md)
 
 Как и обещалось, мы также можем использовать препроцессоры, такие как Pug, Babel (с модулями ES2015) и Stylus для создания более ясных и функциональных компонентов.
 
 <img src="/images/vue-component-with-preprocessors.png" style="display: block; margin: 30px auto">
 
-Перечисленные языки даны только для примера. С тем же успехом можно использовать Buble, TypeScript, SCSS, PostCSS — или любые другие пре- или постпроцессоры по вкусу.
+Перечисленные языки даны только для примера. С тем же успехом можно использовать Buble, TypeScript, SCSS, PostCSS — или любые другие пре- или постпроцессоры по вкусу. При использовании Webpack вместе с `vue-loader`, вы также получаете прекрасную поддержку CSS-модулей.
 
-<!-- TODO: include CSS modules once it's supported in vue-loader 9.x -->
+### Что насчёт разделения ответственности?
+
+Одна важная вещь, что следует отметить — **разделение ответственности это не тоже самое что разделение на файлы по типу.** В современной разработке UI мы обнаружили, что вместо разделения кодовой базы на три огромных слоя, что тесно переплетаются друг с другом, имеет больше смысла делить их на слабо связанные компоненты и компоновать уже их. Внутри компонента, его шаблон, логика и стили неразрывно связаны между собой, что позволяет сделать компонент более сплочённым и удобным в поддержке.
+
+Если вам не нравится идея однофайловых компонентов, вы также можете пользоваться возможностями горячей заменой модулей и пре-компиляцией выделив JavaScript и CSS в отдельные файлы:
+
+``` html
+<!-- my-component.vue -->
+<template>
+  <div>Это будет предварительно скомпилировано</div>
+</template>
+<script src="./my-component.js"></script>
+<style src="./my-component.css"></style>
+```
 
 ## Начало работы
 
@@ -47,7 +60,7 @@ order: 19
 
 После того как вы уделили время этим ресурсам, мы советуем вам посмотреть на шаблон [webpack-simple](https://github.com/vuejs-templates/webpack-simple). Следуйте инструкциям, и очень скоро у вас будет рабочий проект с `.vue`-компонентами, ES2015 и hot-reloading.
 
-Этот шаблон использует [Webpack](https://webpack.github.io/) — сборщик, соединяющий набор "модулей" в результирующее приложение. [Это видео](https://www.youtube.com/watch?v=WQue1AN93YU) представляет собой неплохое введение. Разобравшись с основами, вы возможно также захотите посмотреть [этот курс по продвинутому использованию Webpack на Egghead.io](https://egghead.io/courses/using-webpack-for-production-javascript-applications).
+Этот шаблон использует [Webpack](https://webpack.js.org/) — сборщик, соединяющий набор "модулей" в результирующее приложение. [Это видео](https://www.youtube.com/watch?v=WQue1AN93YU) представляет собой неплохое введение. Разобравшись с основами, вы возможно также захотите посмотреть [этот курс по продвинутому использованию Webpack на Egghead.io](https://egghead.io/courses/using-webpack-for-production-javascript-applications).
 
 В Webpack каждый модуль может быть подвергнут трансформации загрузчиком ("loader") перед включением в сборку. Vue предоставляет плагин [vue-loader](https://github.com/vuejs/vue-loader) для трансляции однофайловых `.vue`-компонентов. Шаблон [webpack-simple](https://github.com/vuejs-templates/webpack-simple) содержит уже настроенный проект, но если вы хотели бы узнать больше о том, как работают `.vue`-компоненты в связке с Webpack, можно почитать [документацию vue-loader](https://vue-loader.vuejs.org).
 

src/v2/guide/ssr.md

@@ -18,7 +18,7 @@ Google и Bing прекрасно индексируют синхронные Ja
 
 Пользователи могут приходить на ваш сайт из отдалённых районов с медленным соединением — или же просто через медленный мобильный интернет. В таких случаях лучше минимизировать количество и объём запросов, требующихся для отображения основного контента.
 
-Во избежания загрузки целого приложения можно использовать [инструменты Webpack для разделения кода](https://webpack.github.io/docs/code-splitting.html), но даже этот подход не будет столь же эффективен, как скачивание уже готового отрендеренного на сервере файла.
+Во избежания загрузки целого приложения можно использовать [инструменты Webpack для разделения кода](https://webpack.js.org/guides/code-splitting-require/), но даже этот подход не будет столь же эффективен, как скачивание уже готового отрендеренного на сервере файла.
 
 ### Клиенты с устаревшим JavaScript (или вовсе без такового)
 

src/v2/guide/transitions.md

@@ -983,7 +983,7 @@ new Vue({
 Давайте теперь разберём несложный пример анимации перехода вставки и удаления, использующий те же CSS-классы, что мы рассматривали ранее:
 
 ``` html
-<div id="list-demo" class="demo">
+<div id="list-demo">
   <button v-on:click="add">Добавить</button>
   <button v-on:click="remove">Удалить</button>
   <transition-group name="list" tag="p">