diff --git a/docs/ja/configurations/extract-css.md b/docs/ja/configurations/extract-css.md index 63956ba34..e166a56a8 100644 --- a/docs/ja/configurations/extract-css.md +++ b/docs/ja/configurations/extract-css.md @@ -1,13 +1,46 @@ # CSS を単一のファイルに抽出する -すべての Vue コンポーネントで処理されたすべての CSS を 1 つの CSS ファイルに抽出する例: - -### Webpack 2.x - ``` bash npm install extract-text-webpack-plugin --save-dev ``` +## 簡単な方法 + +> vue-loader@^12.0.0 と webpack@^2.0.0 必須 + +``` js +// webpack.config.js +var ExtractTextPlugin = require("extract-text-webpack-plugin") + +module.exports = { + // 他のオプション... + module: { + rules: [ + { + test: /\.vue$/, + loader: 'vue-loader', + options: { + extractCSS: true + } + } + ] + }, + plugins: [ + new ExtractTextPlugin("style.css") + ] +} +``` + +上記は、`*.vue` ファイル内部の ` ``` diff --git a/docs/pt_BR/features/scoped-css.md b/docs/pt_BR/features/scoped-css.md index 700cfc9af..ce104cb7f 100644 --- a/docs/pt_BR/features/scoped-css.md +++ b/docs/pt_BR/features/scoped-css.md @@ -18,13 +18,13 @@ Para o seguinte: ```html ``` @@ -48,4 +48,4 @@ Para o seguinte: 4. **Os estilos com escopo não eliminam a necessidade de classes**. Devido a forma como navegadores processam vários seletores CSS, `p { color: red }` irá ser muitas vezes mais lento quando com escopo \(exemplo: quando combinado com um seletor de atributo\). Se você usa classes ou ids ao invés, como em `.example { color: red }`, então você elimina praticamente esse desempenho atingido. [Aqui está um playground](http://stevesouders.com/efws/css-selectors/csscreate.php) onde você pode testar as diferenças você mesmo. -5. **Tenha cuidado com seletores descendentes em componentes recursivos!** Para uma regra CSS com o seletor `.a .b`, se o elemento que coincide com `.a` contém um componente filho recursivo, então todos os `.b` nesse componente filho serão correspondidos pela regra. \ No newline at end of file +5. **Tenha cuidado com seletores descendentes em componentes recursivos!** Para uma regra CSS com o seletor `.a .b`, se o elemento que coincide com `.a` contém um componente filho recursivo, então todos os `.b` nesse componente filho serão correspondidos pela regra. diff --git a/docs/zh-cn/features/scoped-css.md b/docs/zh-cn/features/scoped-css.md index 7f533f7d3..237e0321e 100644 --- a/docs/zh-cn/features/scoped-css.md +++ b/docs/zh-cn/features/scoped-css.md @@ -18,13 +18,13 @@ ``` html ```