Skip to content

Commit f2806d9

Browse files
committed
docs: fix links
close #3367
1 parent 74e8808 commit f2806d9

File tree

5 files changed

+52
-45
lines changed

5 files changed

+52
-45
lines changed

docs/fr/guide/advanced/lazy-loading.md

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,16 @@ En combinant la [fonctionnalité de composant asynchrone](https://fr.vuejs.org/v
66

77
Premièrement, un composant asynchrone peut définir une fonction fabrique qui retourne une Promesse (qui devrait résoudre le composant lui-même) :
88

9-
``` js
10-
const Foo = () => Promise.resolve({ /* définition du composant */ })
9+
```js
10+
const Foo = () =>
11+
Promise.resolve({
12+
/* définition du composant */
13+
})
1114
```
1215

1316
Deuxièmement, avec webpack 2, nous pouvons utiliser la syntaxe d'[import dynamique](https://github.com/tc39/proposal-dynamic-import) pour indiquer un point de scission de code :
1417

15-
``` js
18+
```js
1619
import('./Foo.vue') // returns a Promise
1720
```
1821

@@ -22,25 +25,23 @@ si vous utilisez Babel, vous aurez besoin d'ajouter le plugin [syntax-dynamic-im
2225

2326
En combinant les deux, on définit un composant asynchrone qui sera automatiquement scindé par webpack :
2427

25-
``` js
28+
```js
2629
const Foo = () => import('./Foo.vue')
2730
```
2831

2932
Rien n'a besoin d'être modifié dans la configuration de la route, utilisez `Foo` comme d'habitude.
3033

31-
``` js
34+
```js
3235
const router = new VueRouter({
33-
routes: [
34-
{ path: '/foo', component: Foo }
35-
]
36+
routes: [{ path: '/foo', component: Foo }]
3637
})
3738
```
3839

3940
## Grouper des composants dans le même fragment
4041

41-
Parfois on aimerait grouper tous les composants imbriqués sous la même route, dans un seul et même fragment asynchrone. Pour arriver à cela, nous avons besoin d'utiliser les [fragments nommés](https://webpack.js.org/guides/code-splitting-async/#chunk-names) en donnant un nom au fragment en utilisant une syntaxe de commentaire spéciale (requires webpack > 2.4) :
42+
Parfois on aimerait grouper tous les composants imbriqués sous la même route, dans un seul et même fragment asynchrone. Pour arriver à cela, nous avons besoin d'utiliser les [fragments nommés](https://webpack.js.org/api/module-methods/#magic-comments) en donnant un nom au fragment en utilisant une syntaxe de commentaire spéciale (requires webpack > 2.4) :
4243

43-
``` js
44+
```js
4445
const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
4546
const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')
4647
const Baz = () => import(/* webpackChunkName: "group-foo" */ './Baz.vue')

docs/guide/advanced/lazy-loading.md

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,16 @@ Combining Vue's [async component feature](https://vuejs.org/guide/components.htm
88

99
First, an async component can be defined as a factory function that returns a Promise (which should resolve to the component itself):
1010

11-
``` js
12-
const Foo = () => Promise.resolve({ /* component definition */ })
11+
```js
12+
const Foo = () =>
13+
Promise.resolve({
14+
/* component definition */
15+
})
1316
```
1417

1518
Second, in webpack 2, we can use the [dynamic import](https://github.com/tc39/proposal-dynamic-import) syntax to indicate a code-split point:
1619

17-
``` js
20+
```js
1821
import('./Foo.vue') // returns a Promise
1922
```
2023

@@ -24,25 +27,23 @@ if you are using Babel, you will need to add the [syntax-dynamic-import](https:/
2427

2528
Combining the two, this is how to define an async component that will be automatically code-split by webpack:
2629

27-
``` js
30+
```js
2831
const Foo = () => import('./Foo.vue')
2932
```
3033

3134
Nothing needs to change in the route config, just use `Foo` as usual:
3235

33-
``` js
36+
```js
3437
const router = new VueRouter({
35-
routes: [
36-
{ path: '/foo', component: Foo }
37-
]
38+
routes: [{ path: '/foo', component: Foo }]
3839
})
3940
```
4041

4142
## Grouping Components in the Same Chunk
4243

43-
Sometimes we may want to group all the components nested under the same route into the same async chunk. To achieve that we need to use [named chunks](https://webpack.js.org/guides/code-splitting-async/#chunk-names) by providing a chunk name using a special comment syntax (requires webpack > 2.4):
44+
Sometimes we may want to group all the components nested under the same route into the same async chunk. To achieve that we need to use [named chunks](https://webpack.js.org/api/module-methods/#magic-comments) by providing a chunk name using a special comment syntax (requires webpack > 2.4):
4445

45-
``` js
46+
```js
4647
const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
4748
const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')
4849
const Baz = () => import(/* webpackChunkName: "group-foo" */ './Baz.vue')

docs/ja/guide/advanced/lazy-loading.md

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,29 +8,32 @@ Vue の [非同期コンポーネント機能](http://jp.vuejs.org/guide/compone
88

99
最初に、非同期コンポーネントは Promise (コンポーネント自身解決する必要がある) を返すファクトリ関数として定義できます:
1010

11-
``` js
12-
const Foo = () => Promise.resolve({ /* component definition */ })
11+
```js
12+
const Foo = () =>
13+
Promise.resolve({
14+
/* component definition */
15+
})
1316
```
1417

1518
次に、webpack 2 において [動的 import](https://github.com/tc39/proposal-dynamic-import) 構文を使用して、コード分割ポイントを示すことができます:
1619

17-
``` js
20+
```js
1821
import('./Foo.vue') // returns a Promise
1922
```
2023

2124
> Note: Babel を使用している場合、Babel が構文を正しく解析するために [syntax-dynamic-import](https://babeljs.io/docs/plugins/syntax-dynamic-import/) プラグインを追加する必要があります。
2225
2326
2 つを組み合わせることで、これは、webpack によって自動的にコード分割される非同期コンポーネントを定義する方法です:
2427

25-
``` js
28+
```js
2629
const Foo = () => import('./Foo.vue')
2730
```
2831

2932
## 同じチャンク内でのコンポーネントグループ化
3033

31-
しばしば同じ非同期のチャンクに、そのルート配下のネストされた全てのコンポーネントをグループ化したいと思うかもしれません。それを実現するためには、 特別なコメント構文 (webpack > 2.4 必須)を使用してチャンクの名前を提供する [名前付きチャンク](https://webpack.js.org/guides/code-splitting-async/#chunk-names) を使う必要があります。
34+
しばしば同じ非同期のチャンクに、そのルート配下のネストされた全てのコンポーネントをグループ化したいと思うかもしれません。それを実現するためには、 特別なコメント構文 (webpack > 2.4 必須)を使用してチャンクの名前を提供する [名前付きチャンク](https://webpack.js.org/api/module-methods/#magic-comments) を使う必要があります。
3235

33-
``` js
36+
```js
3437
const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
3538
const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')
3639
const Baz = () => import(/* webpackChunkName: "group-foo" */ './Baz.vue')

docs/kr/guide/advanced/lazy-loading.md

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,39 +6,40 @@ Vue의 [비동기 컴포넌트](http://vuejs.org/guide/components.html#Async-Com
66

77
첫째, 비동기 컴포넌트는 Promise를 반환하는 팩토리 함수로 정의할 수 있습니다 (컴포넌트가 resolve 되어야함).
88

9-
``` js
10-
const Foo = () => Promise.resolve({ /* 컴포넌트 정의 */ })
9+
```js
10+
const Foo = () =>
11+
Promise.resolve({
12+
/* 컴포넌트 정의 */
13+
})
1114
```
1215

1316
둘째, Webpack 2에서 [dynamic import](https://github.com/tc39/proposal-dynamic-import)를 사용하여 코드 분할 포인트를 지정할 수 있습니다.
1417

15-
``` js
18+
```js
1619
import('./Foo.vue') // returns a Promise
17-
```
20+
```
1821

19-
> 참고: Babel을 사용하고 있는 경우 올바른 구문 분석을 위해 [syntax-dynamic-import](http://babeljs.io/docs/plugins/syntax-dynamic-import/) 플러그인을 추가해야합니다.
22+
> 참고: Babel을 사용하고 있는 경우 올바른 구문 분석을 위해 [syntax-dynamic-import](http://babeljs.io/docs/plugins/syntax-dynamic-import/) 플러그인을 추가해야합니다.
2023
21-
이 두 가지를 결합하여 Webpack에 의해 자동으로 코드 분할될 비동기 컴포넌트를 정의하는 방법입니다.
24+
이 두 가지를 결합하여 Webpack에 의해 자동으로 코드 분할될 비동기 컴포넌트를 정의하는 방법입니다.
2225

23-
``` js
24-
const Foo = () => import('./Foo.vue')
26+
```js
27+
const Foo = () => import('./Foo.vue')
2528
```
2629

2730
라우트 설정에서 아무것도 바꿀 필요가 없습니다. `Foo`만 사용하면 됩니다.
2831

29-
``` js
32+
```js
3033
const router = new VueRouter({
31-
routes: [
32-
{ path: '/foo', component: Foo }
33-
]
34+
routes: [{ path: '/foo', component: Foo }]
3435
})
3536
```
3637

3738
### 같은 묶음으로 컴포넌트 그룹화하기
3839

39-
때로는 동일한 라우트 아래에 중첩된 모든 컴포넌트를 동일한 비동기 묶음으로 그룹화 할 수 있습니다. 이를 위해 특수 주석 문법을 사용하는 이름(Webpack 2.4 이상 지원)을 제공하여 [이름을 가진 묶음](https://webpack.js.org/guides/code-splitting-async/#chunk-names)을 사용해야합니다.
40+
때로는 동일한 라우트 아래에 중첩된 모든 컴포넌트를 동일한 비동기 묶음으로 그룹화 할 수 있습니다. 이를 위해 특수 주석 문법을 사용하는 이름(Webpack 2.4 이상 지원)을 제공하여 [이름을 가진 묶음](https://webpack.js.org/api/module-methods/#magic-comments)을 사용해야합니다.
4041

41-
``` js
42+
```js
4243
const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
4344
const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')
4445
const Baz = () => import(/* webpackChunkName: "group-foo" */ './Baz.vue')

docs/ru/guide/advanced/lazy-loading.md

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,10 @@
77
Во-первых, асинхронный компонент можно определить как функцию-фабрику, которая возвращает Promise (который должен разрешиться самим компонентом):
88

99
```js
10-
const Foo = () => Promise.resolve({ /* определение компонента */ })
10+
const Foo = () =>
11+
Promise.resolve({
12+
/* определение компонента */
13+
})
1114
```
1215

1316
Во-вторых, с Webpack 2 мы можем использовать синтаксис [динамических импортов](https://github.com/tc39/proposal-dynamic-import) для указания точек разделения кода:
@@ -30,15 +33,13 @@ const Foo = () => import('./Foo.vue')
3033

3134
```js
3235
const router = new VueRouter({
33-
routes: [
34-
{ path: '/foo', component: Foo }
35-
]
36+
routes: [{ path: '/foo', component: Foo }]
3637
})
3738
```
3839

3940
## Группировка компонентов в одном фрагменте
4041

41-
Иногда может понадобиться объединить в одном фрагменте все компоненты, расположенные по определённому маршруту. Для этого можно указывать [имена фрагментов Webpack](https://webpack.js.org/guides/code-splitting-async/#chunk-names), используя специальный синтаксис комментариев (в версиях Webpack > 2.4):
42+
Иногда может понадобиться объединить в одном фрагменте все компоненты, расположенные по определённому маршруту. Для этого можно указывать [имена фрагментов Webpack](https://webpack.js.org/api/module-methods/#magic-comments), используя специальный синтаксис комментариев (в версиях Webpack > 2.4):
4243

4344
```js
4445
const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')

0 commit comments

Comments
 (0)