You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/ru/configurations/asset-url.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
# Обработка вложенных URL
2
2
3
-
По умолчанию `vue-loader` автоматически обрабатывает стили и файлы шаблонов с помощью [css-loader](https://github.com/webpack/css-loader) и компилятора шаблонов Vue. В процессе компиляции, все использованные URL, такие как `<img src="...">`, `background: url(...)` и CSS `@import` будут **обрабатаны как зависимости модуля**.
3
+
По умолчанию `vue-loader` автоматически обрабатывает стили и файлы шаблонов с помощью [css-loader](https://github.com/webpack/css-loader) и компилятора шаблонов Vue. В процессе компиляции, все использованные URL, такие как `<img src="...">`, `background: url(...)` и CSS `@import` будут **обработаны как зависимости модуля**.
4
4
5
5
Например, `url(./image.png)` будет преобразовано в `require('./image.png')`, а затем
Объект определяющий какие загрузчики webpack переопределят стандартные загрузчики, используемые для обработки секций `*.vue` файлов. Ключ соответствует атрибуту `lang` у секции файла, если таковой был указан. Значения `lang` по умолчанию:
40
28
@@ -45,7 +33,6 @@ module.exports = {
45
33
Например, чтобы использовать `babel-loader` и `eslint-loader` для обработки всех секций `<script>`:
46
34
47
35
```js
48
-
// Конфигурация webpack 2.x
49
36
module: {
50
37
rules: [
51
38
{
@@ -61,17 +48,36 @@ module.exports = {
61
48
}
62
49
```
63
50
51
+
Вы также можете использовать синтаксис объектов или массивов (обратите внимание, что параметры должны быть сериализуемы):
Конфигурация подобна как и в `loaders`, но `preLoaders` будут применены к соответствующим секциям перед стандартными загрузчиками. Вы можете использовать это для предварительной обработки секций - например для локализации на этапе сборки.
70
77
71
78
### postLoaders
72
79
73
80
- Тип: `{ [lang: string]: string }`
74
-
- поддерживается только в версиях 10.3.0+
75
81
76
82
Конфигурация подобна как и в `loaders`, но `postLoaders` применяются после загрузчиков по умолчанию. Вы можете использовать это для пост-обработки языков. Обратите внимание, что тем не менее всё несколько сложнее:
77
83
@@ -81,7 +87,7 @@ module.exports = {
81
87
82
88
### postcss
83
89
84
-
> Примечание: в версиях 11.0.0+ рекомендуется использовать файл конфигурации PostCSS вместо описания секции. [Использование аналогично как в `postcss-loader`](https://github.com/postcss/postcss-loader#usage).
90
+
> Примечание: рекомендуется использовать файл конфигурации PostCSS, чтобы ваши стили в файлах vue и обычном CSS могли использовать одну и ту же конфигурацию. [Использование аналогично как в `postcss-loader`](https://github.com/postcss/postcss-loader#usage).
85
91
86
92
- Тип: `Array` или `Function` или `Object`
87
93
@@ -208,21 +214,6 @@ module.exports = {
208
214
Пример конфигурации:
209
215
210
216
``` js
211
-
// webpack 1
212
-
vue: {
213
-
buble: {
214
-
// enable object spread operator
215
-
// ПРИМЕЧАНИЕ: вам нужно самостоятельно подключить полифилл для Object.assign!
Copy file name to clipboardExpand all lines: docs/ru/workflow/linting.md
+8-67Lines changed: 8 additions & 67 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,90 +2,31 @@
2
2
3
3
Вы, возможно, гадаете, как же прогонять код в `*.vue` файлах через статические анализаторы, поскольку это не JavaScript. Мы предполагаем, что вы используете [ESLint](https://eslint.org/) (если нет, настоятельно рекомендуем!).
4
4
5
-
Вам также понадобится [eslint-html-plugin](https://github.com/BenoitZugmeyer/eslint-plugin-html) с поддержкой извлечения и анализа JavaScript в `*.vue` файлах.
5
+
Вам также понадобится официальный [eslint-plugin-vue](https://github.com/vuejs/eslint-plugin-vue), который поддерживает анализа шаблона и скриптов в `*.vue` файлах.
6
6
7
-
Убедитесь в том, что вы добавили плагин в конфигурацию ESLint:
7
+
Убедитесь, что используете поставляемую с плагином конфигурацию в вашей конфигурации ESLint:
8
8
9
9
```json
10
-
"plugins": [
11
-
"html"
12
-
]
13
-
```
14
-
15
-
Затем в командной строке:
16
-
17
-
```bash
18
-
eslint --ext js,vue MyComponent.vue
19
-
```
20
-
21
-
Другой вариант – использовать [eslint-loader](https://github.com/MoOx/eslint-loader), который будет автоматически анализировать `*.vue` файлы после сохранения во время разработки:
22
-
23
-
```bash
24
-
npm install eslint eslint-loader --save-dev
25
-
```
26
-
27
-
```js
28
-
// webpack.config.js
29
-
module.exports= {
30
-
// ... прочие опции
31
-
module: {
32
-
loaders: [
33
-
{
34
-
test:/\.vue$/,
35
-
loader:'vue!eslint'
36
-
}
37
-
]
38
-
}
10
+
{
11
+
"extends": [
12
+
"plugin:vue/essential"
13
+
]
39
14
}
40
15
```
41
16
42
-
Обратите внимание, что загрузчики webpack применяются **справа-налево**. Убедитесь, что `eslint` прописан перед `vue`, чтобы код сначала проходил через анализатор, а затем компилировался.
43
-
44
-
Стоит упомянуть об использовании сторонних `*.vue` компонентов, поставляемых в NPM пакетах. В таком случае нам нужно воспользоваться `vue-loader`? чтобы подключить сторонние компоненты, но не анализировать их. Мы можем вынести анализ в [предзагрузчики](https://webpack.github.io/docs/loaders.html#loader-order) webpack:
45
-
46
-
```js
47
-
// webpack.config.js
48
-
module.exports= {
49
-
// ... прочие опции
50
-
module: {
51
-
// анализировать только локальные *.vue файлы
52
-
preLoaders: [
53
-
{
54
-
test:/\.vue$/,
55
-
loader:'eslint',
56
-
exclude:/node_modules/
57
-
}
58
-
],
59
-
// но использовать vue-loader для всех *.vue файлов
60
-
loaders: [
61
-
{
62
-
test:/\.vue$/,
63
-
loader:'vue'
64
-
}
65
-
]
66
-
}
67
-
}
68
-
```
69
-
70
-
Для webpack 2.x:
17
+
Убедитесь, что он применяется как предварительный загрузчик:
71
18
72
19
```js
73
20
// webpack.config.js
74
21
module.exports= {
75
22
// ... прочие опции
76
23
module: {
77
24
rules: [
78
-
// анализировать только локальные *.vue файлы
79
25
{
80
26
enforce:'pre',
81
-
test:/\.vue$/,
27
+
test:/\.(js|vue)$/,
82
28
loader:'eslint-loader',
83
29
exclude:/node_modules/
84
-
},
85
-
// но использовать vue-loader для всех *.vue файлов
0 commit comments