update ja docs (#870)

* update injector explanation

NOTE:
  pick up from 0b4fe90

* bring from en docs

* translate previous commit

* use phantomjs-prebuilt

* add guide for global scss loading

* translate previous commit

* fix translation of review comments

Author: kazupon

Diff for: docs/ja/configurations/pre-processors.md

@@ -37,6 +37,40 @@ npm install sass-loader node-sass --save-dev
 
 vue-loader を構成する方法の詳細については、[高度な loader の設定](./advanced.md)セクションを参照してください。
 
+#### グローバル設定ファイルの読み込み
+
+一般的な要求は、毎回明示的にインポートする必要なく、各コンポーネントに設定ファイルを読み込み可能であることです。例としてすべてのコンポーネントで scss 変数をグローバルに使用することです。これを成し遂げるためには:
+
+``` bash
+npm install sass-resources-loader --save-dev
+```
+
+のように `sass-resources-loader` をインストールし、以下の webpack のルールを追加します:
+
+``` js
+{
+  loader: 'sass-resources-loader',
+  options: {
+    resources: path.resolve(__dirname, '../src/style/_variables.scss')
+  }
+}
+```
+
+例として、[vuejs-templates/webpack](https://github.com/vuejs-templates/webpack) を使用している場合、 `build/util.js` を以下のように変更してください:
+
+``` js
+scss: generateLoaders('sass').concat(
+  {
+    loader: 'sass-resources-loader',
+    options: {
+      resources: path.resolve(__dirname, '../src/style/_variables.scss')
+    }
+  }
+),
+```
+
+最終的にコンパイルされたファイルに CSS が重複しないように、変数、ミックスインなどのみをこのファイルに含めることをお勧めします。
+
 ### JavaScript
 
 全ての Vue コンポーネントの JavaScript はデフォルトで `babel-loader` によって処理されます。しかしもちろんそれは変更することが可能です:

Diff for: docs/ja/features/scoped-css.md

@@ -49,3 +49,19 @@
 4. **スコープされたスタイルは class の必要性を排除しません**。ブラウザが様々な CSS セレクタをレンダリングするため、`p { color: red }` はスコープされているとき何倍も遅くなります（すなわち属性セレクタと組み合わせた場合）。もし `.example { color: red }` のように class か id を使用するなら、パフォーマンスヒットは事実上なくなります。[この例](http://stevesouders.com/efws/css-selectors/csscreate.php)で違いをテストすることが出来ます。
 
 5. **再帰されたコンポーネントの子孫セレクタには気をつけてください！** セレクタ `.a .b` を持つ CSS ルールの場合、`.a` にマッチする要素に再帰的な子コンポーネントが含まれている場合、その子コンポーネントのすべての `.b` はルールにマッチします。
+
+6. `scoped` スタイルで入れ子のセレクタが必要なら、CSS に対して `>>>` オペレータを、そして `scss` に対しては `/deep/` を使用する必要があります:
+
+    ``` html
+    <style scoped>
+    .a >>> .b {
+    
+    }
+    </style>
+    
+    <style lang="scss" scoped>
+    .a /deep/ .b {
+    
+    }
+    </style>
+    ```

Diff for: docs/ja/workflow/testing-with-mocks.md

@@ -36,13 +36,13 @@ npm install inject-loader@^2.0.0 --save-dev
 
 ``` js
 // example.spec.js
-const ExampleInjector = require('!!vue?inject!./example.vue')
+const ExampleInjector = require('!!vue-loader?inject!./example.vue')
 ```
 
 注意。狂気じみた文字列を必要とします - ここではいくつかのインライン [webpack loader](https://webpack.github.io/docs/loaders.html) を使用しています。簡単な説明としては:
 
 - `!!`は "グローバル設定からすべてのローダを無効にする"ことを意味します；
-- `vue？inject！` は  "`vue` loader を使い、`？inject` クエリを渡す"ことを意味します。 これは `vue-loader` に、依存性注入モードでコンポーネントをコンパイルするように指示します。
+- `vue-loader？inject！` は  `vue-loader` を使い、`？inject` クエリを渡す"ことを意味します。 これは `vue-loader` に、依存性注入モードでコンポーネントをコンパイルするように指示します。
 
 返される `ExampleInjector` は、`example.vue` モジュールのインスタンスを生成するために呼び出すことができるファクトリ関数です:
 

Diff for: docs/ja/workflow/testing.md

@@ -10,7 +10,7 @@ Karma はブラウザを起動してテストを実行するテストランナ
 npm install\
   karma karma-webpack\
   karma-jasmine jasmine-core\
-  karma-phantomjs-launcher phantomjs\
+  karma-phantomjs-launcher phantomjs--prebuilt\
   --save-dev
 ```