@vue/language-service 1.8.14 → 1.8.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/data/language-blocks/pt.json +25 -25
  2. package/data/template/ja.json +1 -1
  3. package/out/plugins/vue.js +1 -1
  4. package/package.json +20 -19
package/data/language-blocks/pt.json CHANGED
@@ -8,7 +8,7 @@
8
8
  "name": "src",
9
9
  "description": {
10
10
  "kind": "markdown",
11
- "value": "\nSe você prefere dividir seu componente `*.vue` em multiplos arquivos, você pode usar o atributo `src` para importar um arquivo externo para o bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nEsteja ciente de que as importações `src` seguem as mesmas regras de resolução de caminho que as solicitações do módulo webpack, o que significa:\n\n- Caminhos relativos precisam começar com `./`\n- Você pode importar recursos de dependências do npm:\n\n```vue\n<!-- importa um arquivo do pacote de npm \"todomvc-app-css\" -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações com `src` também funcionam com blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
11
+ "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n<!-- importar um ficheiro dum pacote \"todomvc-app-css\" instalado -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações de `src` também funcionam com os blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
12
12
  },
13
13
  "references": [
14
14
  {
@@ -45,7 +45,7 @@
45
45
  "name": "lang",
46
46
  "description": {
47
47
  "kind": "markdown",
48
- "value": "\nBlocos pode declarar linguagens de pré-processadores usando o atributo `lang`. A caso mais comum é usando TypeScript para o bloco `<script>`:\n```html\n<script lang=\"ts\">\n // usa TypeScript\n</script>\n```\n\n`lang` pode ser aplicado a qualquer bloco - por exemplo, nós podemos usar `<style>` com [Sass](https://sass-lang.com/) e `<template>` com [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNote que a integração com vários pré-processadores pode diferir por conjunto de ferramentas. Confira a respectiva documentação para exemplos:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
48
+ "value": "\nOs blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `<script>`:\n\n\n```html\n<script lang=\"ts\">\n // usar TypeScript\n</script>\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `<style>` com a [Sass](https://sass-docs-pt.netlify.app/) e o `<template>` com a [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
49
49
  },
50
50
  "values": [
51
51
  {
@@ -89,7 +89,7 @@
89
89
  ],
90
90
  "description": {
91
91
  "kind": "markdown",
92
- "value": "\n- Cada arquivo `*.vue` pode conter no máximo um bloco `<template>` de alto nível por vez.\n\n- O conteúdo será extraído e passado para `@vue/compiler-dom`, pré-compilado em funções de renderização JavaScript e anexado ao componente exportado como sua opção `render`.\n"
92
+ "value": "\n- Cada ficheiro `*.vue` pode conter no máximo um bloco `<template>` de alto nível.\n\n- O conteúdo será extraído e passado ao `@vuw/compiler-dom`, pré-compilado dentro de funções de interpretação de JavaScript, e anexado ao componente exportado como sua opção `render`.\n"
93
93
  },
94
94
  "references": [
95
95
  {
@@ -129,7 +129,7 @@
129
129
  "name": "src",
130
130
  "description": {
131
131
  "kind": "markdown",
132
- "value": "\nSe você prefere dividir seu componente `*.vue` em multiplos arquivos, você pode usar o atributo `src` para importar um arquivo externo para o bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nEsteja ciente de que as importações `src` seguem as mesmas regras de resolução de caminho que as solicitações do módulo webpack, o que significa:\n\n- Caminhos relativos precisam começar com `./`\n- Você pode importar recursos de dependências do npm:\n\n```vue\n<!-- importa um arquivo do pacote de npm \"todomvc-app-css\" -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações com `src` também funcionam com blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
132
+ "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n<!-- importar um ficheiro dum pacote \"todomvc-app-css\" instalado -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações de `src` também funcionam com os blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
133
133
  },
134
134
  "references": [
135
135
  {
@@ -166,7 +166,7 @@
166
166
  "name": "lang",
167
167
  "description": {
168
168
  "kind": "markdown",
169
- "value": "\nBlocos pode declarar linguagens de pré-processadores usando o atributo `lang`. A caso mais comum é usando TypeScript para o bloco `<script>`:\n```html\n<script lang=\"ts\">\n // usa TypeScript\n</script>\n```\n\n`lang` pode ser aplicado a qualquer bloco - por exemplo, nós podemos usar `<style>` com [Sass](https://sass-lang.com/) e `<template>` com [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNote que a integração com vários pré-processadores pode diferir por conjunto de ferramentas. Confira a respectiva documentação para exemplos:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
169
+ "value": "\nOs blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `<script>`:\n\n\n```html\n<script lang=\"ts\">\n // usar TypeScript\n</script>\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `<style>` com a [Sass](https://sass-docs-pt.netlify.app/) e o `<template>` com a [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
170
170
  },
171
171
  "values": [
172
172
  {
@@ -221,7 +221,7 @@
221
221
  "valueSet": "v",
222
222
  "description": {
223
223
  "kind": "markdown",
224
- "value": "\n- Cada arquivo `*.vue` pode conter no máximo um bloco `<script setup>` de alto nível por vez (excluíndo `<script>` normal).\n\n- O script é pré-processado e usado como a função `setup()` do componente, o que significa que será executado **para cada instância do componente**. Ligações de nível superior em `<script setup>` são automaticamente expostas ao template. Para obter mais detalhes, consulte [documentação dedicada a `<script setup>`](https://pt.vuejs.org/api/sfc-script-setup.html).\n"
224
+ "value": "\n- Cada ficheiro `*.vue` pode conter no máximo um bloco `<script setup>` (excluindo o `<script>` normal).\n\n- O programa é pré-processado e usado como a função `setup()` do componente, o que significa que será executado **para cada instância do componente**. Os vínculos de alto nível no `<script setup>` são automaticamente expostos ao modelo de marcação. Para mais detalhes, consulte a [documentação dedicada ao `<script setup>`](https://pt.vuejs.org/api/sfc-script-setup.html).\n"
225
225
  },
226
226
  "references": [
227
227
  {
@@ -257,7 +257,7 @@
257
257
  ],
258
258
  "description": {
259
259
  "kind": "markdown",
260
- "value": "\n- Cada arquivo `*.vue` pode conter no máximo um bloco `<script>` de alto nível por vez (excluíndo [`<script setup>`](https://pt.vuejs.org/api/sfc-script-setup.html)).\n\n- O escript é executado como um módulo ES.\n\n- A **exportação padrão** `default export` deve ser um objeto de opções do componente Vue, seja como um objeto simples ou como o valor de retorno de [defineComponent](https://pt.vuejs.org/api/general.html#definecomponent)\n"
260
+ "value": "\n- Cada ficheiro `*.vue` poder conter no máximo um bloco `<script>` de alto nível (excluindo [`<script setup>`](https://pt.vuejs.org/api/sfc-script-setup.html)).\n\n- O programa é executado como um módulo de ECMAScript.\n\n- A **exportação padrão** deve ser um objeto de opções de componente da Vue, ou como um objeto simples ou como valor de retorno da [`defineComponent`](https://pt.vuejs.org/api/general.html#definecomponent).\n"
261
261
  },
262
262
  "references": [
263
263
  {
@@ -295,7 +295,7 @@
295
295
  "attributes": [],
296
296
  "description": {
297
297
  "kind": "markdown",
298
- "value": "\n- Cada arquivo `*.vue` pode conter no máximo um bloco `<script setup>` de alto nível por vez (excluíndo `<script>` normal).\n\n- O script é pré-processado e usado como a função `setup()` do componente, o que significa que será executado **para cada instância do componente**. Ligações de nível superior em `<script setup>` são automaticamente expostas ao template. Para obter mais detalhes, consulte [documentação dedicada a `<script setup>`](https://pt.vuejs.org/api/sfc-script-setup.html).\n"
298
+ "value": "\n- Cada ficheiro `*.vue` pode conter no máximo um bloco `<script setup>` (excluindo o `<script>` normal).\n\n- O programa é pré-processado e usado como a função `setup()` do componente, o que significa que será executado **para cada instância do componente**. Os vínculos de alto nível no `<script setup>` são automaticamente expostos ao modelo de marcação. Para mais detalhes, consulte a [documentação dedicada ao `<script setup>`](https://pt.vuejs.org/api/sfc-script-setup.html).\n"
299
299
  },
300
300
  "references": [
301
301
  {
@@ -335,7 +335,7 @@
335
335
  "name": "src",
336
336
  "description": {
337
337
  "kind": "markdown",
338
- "value": "\nSe você prefere dividir seu componente `*.vue` em multiplos arquivos, você pode usar o atributo `src` para importar um arquivo externo para o bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nEsteja ciente de que as importações `src` seguem as mesmas regras de resolução de caminho que as solicitações do módulo webpack, o que significa:\n\n- Caminhos relativos precisam começar com `./`\n- Você pode importar recursos de dependências do npm:\n\n```vue\n<!-- importa um arquivo do pacote de npm \"todomvc-app-css\" -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações com `src` também funcionam com blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
338
+ "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n<!-- importar um ficheiro dum pacote \"todomvc-app-css\" instalado -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações de `src` também funcionam com os blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
339
339
  },
340
340
  "references": [
341
341
  {
@@ -372,7 +372,7 @@
372
372
  "name": "lang",
373
373
  "description": {
374
374
  "kind": "markdown",
375
- "value": "\nBlocos pode declarar linguagens de pré-processadores usando o atributo `lang`. A caso mais comum é usando TypeScript para o bloco `<script>`:\n```html\n<script lang=\"ts\">\n // usa TypeScript\n</script>\n```\n\n`lang` pode ser aplicado a qualquer bloco - por exemplo, nós podemos usar `<style>` com [Sass](https://sass-lang.com/) e `<template>` com [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNote que a integração com vários pré-processadores pode diferir por conjunto de ferramentas. Confira a respectiva documentação para exemplos:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
375
+ "value": "\nOs blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `<script>`:\n\n\n```html\n<script lang=\"ts\">\n // usar TypeScript\n</script>\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `<style>` com a [Sass](https://sass-docs-pt.netlify.app/) e o `<template>` com a [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
376
376
  },
377
377
  "values": [
378
378
  {
@@ -430,7 +430,7 @@
430
430
  "valueSet": "v",
431
431
  "description": {
432
432
  "kind": "markdown",
433
- "value": "\nQuando uma tag `<style>` tem o atributo `scoped`, seu CSS se aplica apenas aos elementos do componente atual. Isso é semelhante ao encapsulamento de estilo encontrado no Shadow DOM. Por mais que tenha algumas ressalvas, não requer nenhum polyfill. É alcançado usando o PostCSS para transformar o seguinte código:\n\n```vue\n<style scoped>\n.example {\n color: red;\n}\n</style>\n\n<template>\n <div class=\"example\">olá</div>\n</template>\n```\n\nNesse outro código:\n\n```vue\n<style>\n.example[data-v-f3f3eg9] {\n color: red;\n}\n</style>\n\n<template>\n <div class=\"example\" data-v-f3f3eg9>olá</div>\n</template>\n```\n\n### Elementos raiz de componentes filhos \n\nCom `scoped`, os estilos do componente pai não vazam para os componentes filhos. No entanto, o nó raiz de um componente filho será afetado pelo CSS do componente pai e pelo CSS do componente filho. Isso é feito de propósito para que o pai possa estilizar o elemento raiz do filho para fins de layout.\n\n### Seletores profundos \n\nSe você deseja que um seletor em estilos `scoped` seja \"profundo\", ou seja, afetando componentes filhos, você pode usar a pseudo-classe `:deep()`:\n\n```vue\n<style scoped>\n.a :deep(.b) {\n /* ... */\n}\n</style>\n```\n\nO código acima será compilado para:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip\nOs nós DOM criados com `v-html` não são afetados pelos estilos delimitados, mas você ainda pode estilizá-los usando seletores profundos.\n:::\n\n### Seletores de slot \n\nPor padrão, os estilos delimitados não afetam o conteúdo renderizado por `<slot/>`, pois eles são considerados de propriedade do componente pai que os passa. Para estilizar explicitamente o conteúdo do slot, use a pseudo-classe `:slotted`:\n\n```vue\n<style scoped>\n:slotted(div) {\n color: red;\n}\n</style>\n```\n\n### Seletores globais \n\nSe você deseja que um seletor aplique-se globalmente, mas ainda esteja em um bloco de estilo `scoped`, você pode usar a pseudo-classe `:global` em vez de criar outro `<style>` (veja abaixo):\n\n```vue\n<style scoped>\n:global(.red) {\n color: red;\n}\n</style>\n```\n\n### Misturando estilos locais e globais \n\nVocê também pode incluir estilos com e sem escopo no mesmo componente:\n\n```vue\n<style>\n/* estilos globais */\n</style>\n\n<style scoped>\n/* estilos locais */\n</style>\n```\n\n### Dicas de estilo delimitado \n\n- **Estilos delimitados não eliminam a necessidade de classes**. Devido a forma que os navegadores renderizam vários seletores CSS, `p { color: red }` será muito mais lento quando delimitado (isto é, quando combinado com um seletor de atributo). Se você usar classes ou ids, como em `.example { color: red }`, então você virtualmente elimina esse impacto de desempenho.\n\n- **Tenha cuidado com seletores descendentes em componentes recursivos!** Para uma regra CSS com o seletor `.a .b`, se o elemento que corresponde a `.a` contém um componente filho recursivo, então todos os `.b` nesse componente filho serão correspondidos pela regra.\n"
433
+ "value": "\nQuando um marcador `<style>` tiver o atributo `scoped`, o seu CSS apenas aplicar-se-á aos elementos do componente atual. Isto é semelhante ao encapsulamento de estilo encontrado no DOM de Sombra. Ele vem com algumas advertências, mas não exige quaisquer preenchimento de funcionalidade. Ele é alcançado usando PostCSS para transformar o seguinte:\n\n```vue\n<style scoped>\n.example {\n color: red;\n}\n</style>\n\n<template>\n <div class=\"example\">hi</div>\n</template>\n```\n\nNo seguinte:\n\n```vue\n<style>\n.example[data-v-f3f3eg9] {\n color: red;\n}\n</style>\n\n<template>\n <div class=\"example\" data-v-f3f3eg9>hi</div>\n</template>\n```\n\n### Elementos de Raiz do Componente Filho \n\nCom `scoped`, os estilos do componente pai não passarão para os componentes filhos. No entanto, um nó de raiz do componente filho será afetado por ambas CSS isolada do pai e a CSS isolada do filho. Isto é de propósito para que o pai possa estilizar o elemento de raiz filho para fins de disposição.\n\n### Seletores Profundos \n\nSe quisermos que um seletor nos estilos `scoped` torne-se \"profundo\", ou seja, afete componentes filho, podemos usar a pseudo-classe `:deep()`:\n\n```vue\n<style scoped>\n.a :deep(.b) {\n /* ... */\n}\n</style>\n```\n\nO código acima será compilado para:\n\n```css\n.a[data-v-f3f3eg9] .b {\n /* ... */\n}\n```\n\n:::tip DICA\nOs conteúdos do DOM criados com `v-html` não são afetados pelos estilos isolados, mas ainda podemos estilizá-los usando seletores profundos.\n:::\n\n### Seletores Inseridos \n\nPor padrão, os estilos isolados não afetam os conteúdos interpretados pelo `<slot/>`, uma vez que são considerados ser propriedade do componente pai que está a passá-los. Para explicitamente atingir o conteúdo da ranhura, usamos a pseudo-classe `:slotted`:\n\n```vue\n<style scoped>\n:slotted(div) {\n color: red;\n}\n</style>\n```\n\n### Seletores Globais \n\nSe quisermos que apenas uma regra aplique-se globalmente, podemos usar a pseudo-classe `:global` ao invés de criar um outro `<style>` (consulte o exemplo abaixo):\n\n```vue\n<style scoped>\n:global(.red) {\n color: red;\n}\n</style>\n```\n\n### Misturando Estilos Locais e Globais \n\nNós também podemos incluir ambos estilos isolados e não isolados no mesmo componente:\n\n```vue\n<style>\n/* estilos globais */\n</style>\n\n<style scoped>\n/* estilos locais */\n</style>\n```\n\n### Dicas de Estilo Isolado \n\n- **Os estilos isolados não eliminam a necessidade de classes**. Por causa da maneira que os navegadores interpretam os vários seletores de CSS, `p { color: red }` será muitas vezes mais lento quando isolado (ou seja, quando combinado com um seletor de atributo). Se usarmos as classes (por exemplo, `.class-name`) ou identificadores (por exemplo, `#id-name`), tal como em `.example { color: red }`, então eliminamos virtualmente este impacto de desempenho.\n\n- **Temos que ter cuidado com os seletores de descendentes nos componentes recursivos!** Para um regara de CSS com o seletor `.a .b`, se o elemento que corresponde `.a` contiver um componente filho recursivo, então todos os `.b` neste componente filho serão correspondidos pela regra.\n"
434
434
  },
435
435
  "references": [
436
436
  {
@@ -468,7 +468,7 @@
468
468
  "valueSet": "v",
469
469
  "description": {
470
470
  "kind": "markdown",
471
- "value": "\nUma tag `<style module>` é compilada como um [Módulo CSS](https://github.com/css-modules/css-modules) e expõe as classes CSS resultantes para o componente como um objeto sob a chave `$style`:\n\n```vue\n<template>\n <p :class=\"$style.red\">Isto deveria ser vermelho</p>\n</template>\n\n<style module>\n.red {\n color: red;\n}\n</style>\n```\n\nAs classes resultantes tem um hash aplicado para evitar colisões, alcançando o mesmo efeito de delimitar o CSS apenas ao componente atual.\n\nRecorra à [Especificação de Módulos CSS](https://github.com/css-modules/css-modules) para mais detalhes como [exceções globais](https://github.com/css-modules/css-modules#exceptions) e [composição](https://github.com/css-modules/css-modules#composition).\n\n### Nome de injeção personalizado \n\nVocê pode personalizar a propriedade chave do objeto de classes injetadas dando ao atributo `module` um valor:\n\n```vue\n<template>\n <p :class=\"classes.red\">vermelho</p>\n</template>\n\n<style module=\"classes\">\n.red {\n color: red;\n}\n</style>\n```\n\n### Uso com API de Composição \n\nAs classes injetadas podem ser acessadas em `setup()` e `<script setup>` por meio da API `useCssModule`. Para blocos `<style module>` com nomes de injeção personalizados, `useCssModule` aceita o valor do atributo `module` correspondente como primeiro argumento:\n\n```js\nimport { useCssModule } from 'vue'\n\n// dentro do escopo de setup()...\n// padrão, retorna as classes da tag <style module>\nuseCssModule()\n\n// personalizado, retorna as classes da tag <style module=\"classes\">\nuseCssModule('classes')\n```\n"
471
+ "value": "\nUm marcador `<style module>` é compilado como [Módulos de CSS](https://github.com/css-modules/css-modules) e expõe as classes de CSS resultantes ao componente como um objeto sob a chave de `$style`:\n\n```vue\n<template>\n <p :class=\"$style.red\">This should be red</p>\n</template>\n\n<style module>\n.red {\n color: red;\n}\n</style>\n```\n\nAs classes resultantes têm o seu nome gerados com caracteres embaralhados para evitar colisões, alcançando o mesmo efeito de isolar o CSS apenas ao componente atual.\n\nConsulte a [especificação dos Módulos de CSS](https://github.com/css-modules/css-modules) por mais detalhes, tais como [exceções globais](https://github.com/css-modules/css-modules#exceptions) e [composição](https://github.com/css-modules/css-modules#composition).\n\n### Nome de Injeção Personalizado \n\nNós podemos personalizar a chave da propriedade do objeto de classes injetadas dando ao atributo `module` um valor:\n\n```vue\n<template>\n <p :class=\"classes.red\">red</p>\n</template>\n\n<style module=\"classes\">\n.red {\n color: red;\n}\n</style>\n```\n\n### Uso com API de Composição \n\nAs classes injetadas podem ser acessadas na `setup()` e no `<script setup>` através da API `useCssModule`. Para os blocos `<style module>` com nomes de injeção personalizados, `useCssModule` aceita o valor do atributo `module` correspondente como primeiro argumento:\n\n```js\nimport { useCssModule } from 'vue'\n\n// dentro do âmbito de setup()...\n// padrão, retorna as classes do marcador `<style module>`\nuseCssModule()\n\n// personalizado, retorna as classes do marcador `<style module=\"classes\">`\nuseCssModule('classes')\n```\n"
472
472
  },
473
473
  "references": [
474
474
  {
@@ -504,7 +504,7 @@
504
504
  ],
505
505
  "description": {
506
506
  "kind": "markdown",
507
- "value": "\n- Um único arquivo `*.vue` pode conter multiplas tags `<style>`.\n\n- Uma tag `<style>` pode ter atributos `scoped` ou `module` (consulte [Recursos de estilo SFC](https://pt.vuejs.org/api/sfc-css-features.html) para obter mais detalhes) para ajudar a encapsular os estilos no componente atual. Múltiplas tags `<style>` com diferentes modos de encapsulamento podem ser misturados no mesmo componente.\n"
507
+ "value": "\n- Um único ficheiro `*.vue` pode conter vários marcadores de `<style>`.\n\n- Um marcador `<style>` pode ter os atributos `scoped` ou `module` (consulte [Funcionalidades de Estilo do Componente de Ficheiro Único](https://pt.vuejs.org/api/sfc-css-features.html) por mais detalhes) para ajudar a encapsular os estilos ao componente atual. Vários marcadores de `<style>` com diferentes modos de encapsulamento podem ser misturados no mesmo componente.\n"
508
508
  },
509
509
  "references": [
510
510
  {
@@ -538,13 +538,13 @@
538
538
  ]
539
539
  },
540
540
  {
541
- "name": "Blocos Customizados",
541
+ "name": "Blocos Personalizados",
542
542
  "attributes": [
543
543
  {
544
544
  "name": "src",
545
545
  "description": {
546
546
  "kind": "markdown",
547
- "value": "\nSe você prefere dividir seu componente `*.vue` em multiplos arquivos, você pode usar o atributo `src` para importar um arquivo externo para o bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nEsteja ciente de que as importações `src` seguem as mesmas regras de resolução de caminho que as solicitações do módulo webpack, o que significa:\n\n- Caminhos relativos precisam começar com `./`\n- Você pode importar recursos de dependências do npm:\n\n```vue\n<!-- importa um arquivo do pacote de npm \"todomvc-app-css\" -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações com `src` também funcionam com blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
547
+ "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n<!-- importar um ficheiro dum pacote \"todomvc-app-css\" instalado -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações de `src` também funcionam com os blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
548
548
  },
549
549
  "references": [
550
550
  {
@@ -580,36 +580,36 @@
580
580
  ],
581
581
  "description": {
582
582
  "kind": "markdown",
583
- "value": "\nBlocos customizados adicionas podem ser incluídos em um arquivo `*.vue` para qualquer necessidade específica do projeto, por exemplo um bloco `<docs>`. Alguns exemplos do mundo real de blocos customizados incluem:\n\n- [Gridsome: `<page-query>`](https://gridsome.org/docs/querying-data/)\n- [vite-plugin-vue-gql: `<gql>`](https://github.com/wheatjs/vite-plugin-vue-gql)\n- [vue-i18n: `<i18n>`](https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n#i18n-custom-block)\n\nO manuseio de blocos personalizados dependerá de Ferramental - se você deseja criar suas próprias integrações de blocos personalizados, veja a [seção relevante de ferramental](https://pt.vuejs.org/guide/scaling-up/tooling.html#sfc-custom-block-integrations) para obter mais detalhes.\n"
583
+ "value": "\nOs blocos personalizados podem ser incluídos num ficheiro `*.vue` por qualquer necessidade específica do projeto, por exemplo um bloco `<docs>`. Alguns exemplos do mundo real de blocos personalizados incluem:\n\n- [Gridsome: `<page-query>`](https://gridsome.org/docs/querying-data/)\n- [vite-plugin-vue-gql: `<gql>`](https://github.com/wheatjs/vite-plugin-vue-gql)\n- [vue-i18n: `<i18n>`](https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n#i18n-custom-block)\n\nA manipulação dos blocos personalizados dependerá do ferramental - se quisermos construir as nossas próprias integrações de bloco personalizado, podemos consultar a [seção de ferramental de integrações de bloco personalizado do Componente de Ficheiro Único](https://pt.vuejs.org/guide/scaling-up/tooling.html#sfc-custom-block-integrations) por mais detalhes.\n"
584
584
  },
585
585
  "references": [
586
586
  {
587
587
  "name": "en",
588
- "url": "https://vuejs.org/api/sfc-spec.html#blocos-customizados"
588
+ "url": "https://vuejs.org/api/sfc-spec.html#blocos-personalizados"
589
589
  },
590
590
  {
591
591
  "name": "zh-cn",
592
- "url": "https://cn.vuejs.org/api/sfc-spec.html#blocos-customizados"
592
+ "url": "https://cn.vuejs.org/api/sfc-spec.html#blocos-personalizados"
593
593
  },
594
594
  {
595
595
  "name": "ja",
596
- "url": "https://ja.vuejs.org/api/sfc-spec.html#blocos-customizados"
596
+ "url": "https://ja.vuejs.org/api/sfc-spec.html#blocos-personalizados"
597
597
  },
598
598
  {
599
599
  "name": "ua",
600
- "url": "https://ua.vuejs.org/api/sfc-spec.html#blocos-customizados"
600
+ "url": "https://ua.vuejs.org/api/sfc-spec.html#blocos-personalizados"
601
601
  },
602
602
  {
603
603
  "name": "fr",
604
- "url": "https://fr.vuejs.org/api/sfc-spec.html#blocos-customizados"
604
+ "url": "https://fr.vuejs.org/api/sfc-spec.html#blocos-personalizados"
605
605
  },
606
606
  {
607
607
  "name": "ko",
608
- "url": "https://ko.vuejs.org/api/sfc-spec.html#blocos-customizados"
608
+ "url": "https://ko.vuejs.org/api/sfc-spec.html#blocos-personalizados"
609
609
  },
610
610
  {
611
611
  "name": "pt",
612
- "url": "https://pt.vuejs.org/api/sfc-spec.html#blocos-customizados"
612
+ "url": "https://pt.vuejs.org/api/sfc-spec.html#blocos-personalizados"
613
613
  }
614
614
  ]
615
615
  }
@@ -619,7 +619,7 @@
619
619
  "name": "lang",
620
620
  "description": {
621
621
  "kind": "markdown",
622
- "value": "\nBlocos pode declarar linguagens de pré-processadores usando o atributo `lang`. A caso mais comum é usando TypeScript para o bloco `<script>`:\n```html\n<script lang=\"ts\">\n // usa TypeScript\n</script>\n```\n\n`lang` pode ser aplicado a qualquer bloco - por exemplo, nós podemos usar `<style>` com [Sass](https://sass-lang.com/) e `<template>` com [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNote que a integração com vários pré-processadores pode diferir por conjunto de ferramentas. Confira a respectiva documentação para exemplos:\n\n- [Vite](https://vitejs.dev/guide/features.html#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
622
+ "value": "\nOs blocos podem declarar linguagens pré-processadoras usando o atributo `lang`. O caso mais comum é usar TypeScript para o bloco `<script>`:\n\n\n```html\n<script lang=\"ts\">\n // usar TypeScript\n</script>\n```\n\n`lang` pode ser aplicado à qualquer bloco - por exemplo, podemos usar o `<style>` com a [Sass](https://sass-docs-pt.netlify.app/) e o `<template>` com a [Pug](https://pugjs.org/api/getting-started.html):\n\n```html\n<template lang=\"pug\">\np {{ msg }}\n</template>\n\n<style lang=\"scss\">\n $primary-color: #333;\n body {\n color: $primary-color;\n }\n</style>\n```\n\nNota que a integração com os vários pré-processadores pode diferir conforme a cadeia de ferramenta. Consulte a respetiva documentação por exemplos:\n\n- [Vite](https://pt.vitejs.dev/guide/features#css-pre-processors)\n- [Vue CLI](https://cli.vuejs.org/guide/css.html#pre-processors)\n- [webpack + vue-loader](https://vue-loader.vuejs.org/guide/pre-processors.html#using-pre-processors)\n"
623
623
  },
624
624
  "values": [],
625
625
  "references": [
@@ -657,7 +657,7 @@
657
657
  "name": "src",
658
658
  "description": {
659
659
  "kind": "markdown",
660
- "value": "\nSe você prefere dividir seu componente `*.vue` em multiplos arquivos, você pode usar o atributo `src` para importar um arquivo externo para o bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nEsteja ciente de que as importações `src` seguem as mesmas regras de resolução de caminho que as solicitações do módulo webpack, o que significa:\n\n- Caminhos relativos precisam começar com `./`\n- Você pode importar recursos de dependências do npm:\n\n```vue\n<!-- importa um arquivo do pacote de npm \"todomvc-app-css\" -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações com `src` também funcionam com blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
660
+ "value": "\nSe preferirmos separar os nossos componentes `*.vue` em vários ficheiros, podemos usar o atributo `src` para importar um ficheiro externo para um bloco de linguagem:\n\n```vue\n<template src=\"./template.html\"></template>\n<style src=\"./style.css\"></style>\n<script src=\"./script.js\"></script>\n```\n\nDevemos estar ciente de que as importações de `src` seguem as mesmas regras de resolução de caminho que as requisições de módulo da Webpack, o que significa que:\n\n- Os caminhos relativos precisam começar com `./`\n- Nós podemos importar recursos a partir das dependências do npm:\n\n```vue\n<!-- importar um ficheiro dum pacote \"todomvc-app-css\" instalado -->\n<style src=\"todomvc-app-css/index.css\" />\n```\n\nAs importações de `src` também funcionam com os blocos personalizados, por exemplo:\n\n```vue\n<unit-test src=\"./unit-test.js\">\n</unit-test>\n```\n"
661
661
  },
662
662
  "references": [
663
663
  {
package/data/template/ja.json CHANGED
@@ -941,7 +941,7 @@
941
941
  "name": "is",
942
942
  "description": {
943
943
  "kind": "markdown",
944
- "value": "\n[動的コンポーネント](https://ja.vuejs.org/guide/essentials/component-basics.html#dynamic-components)のバインディングに使用します。\n\n- **期待する値:** `string | Component`\n\n- **ネイティブ要素での使用** <sup class=\"vt-badge\">3.1+</sup>\n\n ネイティブの HTML 要素で `is` 属性が使われている場合、[Customized built-in element](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-customized-builtin-example) として解釈されます。これは、ネイティブの Web プラットフォームの機能です。\n\n しかし、[DOM テンプレート解析の注意点](https://ja.vuejs.org/guide/essentials/component-basics.html#dom-template-parsing-caveats)で説明したように、ネイティブ要素を Vue コンポーネントに置き換えるためには Vue が必要になる場合があります。`is` 属性の値の前に `vue:` を付けると、Vue はその要素を Vue コンポーネントとしてレンダリングします:\n\n ```html\n <table>\n <tr is=\"vue:my-row-component\"></tr>\n </table>\n ```\n\n- **参照**\n\n - [ビルトインの特別な要素 - `<component>`](https://ja.vuejs.org/api/built-in-special-elements.html#component)\n - [動的コンポーネント](https://ja.vuejs.org/guide/essentials/component-basics.html#dynamic-components)\n"
944
+ "value": "\n[動的コンポーネント](https://ja.vuejs.org/guide/essentials/component-basics.html#dynamic-components)のバインディングに使用します。\n\n- **期待する値:** `string | Component`\n\n- **ネイティブ要素での使用** <sup class=\"vt-badge\">3.1+</sup>\n\n ネイティブの HTML 要素で `is` 属性が使われている場合、[Customized built-in element](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-customized-builtin-example) として解釈されます。これは、ネイティブの Web プラットフォームの機能です。\n\n しかし、[DOM 内テンプレート解析の注意点](https://ja.vuejs.org/guide/essentials/component-basics.html#in-dom-template-parsing-caveats)で説明したように、ネイティブ要素を Vue コンポーネントに置き換えるためには Vue が必要になる場合があります。`is` 属性の値の前に `vue:` を付けると、Vue はその要素を Vue コンポーネントとしてレンダリングします:\n\n ```html\n <table>\n <tr is=\"vue:my-row-component\"></tr>\n </table>\n ```\n\n- **参照**\n\n - [ビルトインの特別な要素 - `<component>`](https://ja.vuejs.org/api/built-in-special-elements.html#component)\n - [動的コンポーネント](https://ja.vuejs.org/guide/essentials/component-basics.html#dynamic-components)\n"
945
945
  },
946
946
  "references": [
947
947
  {
package/out/plugins/vue.js CHANGED
@@ -33,7 +33,7 @@ const vue = __importStar(require("@vue/language-core"));
33
33
  const data_1 = require("./data");
34
34
  let sfcDataProvider;
35
35
  const create = () => (context, modules) => {
36
- const htmlPlugin = (0, volar_service_html_1.default)({ validLang: 'vue', disableCustomData: true })(context, modules);
36
+ const htmlPlugin = (0, volar_service_html_1.default)({ languageId: 'vue', useCustomDataProviders: false })(context, modules);
37
37
  if (!context)
38
38
  return htmlPlugin;
39
39
  sfcDataProvider ??= html.newHTMLDataProvider('vue', (0, data_1.loadLanguageBlocks)(context.env.locale ?? 'en'));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vue/language-service",
3
- "version": "1.8.14",
3
+ "version": "1.8.16",
4
4
  "main": "out/index.js",
5
5
  "license": "MIT",
6
6
  "files": [
@@ -17,27 +17,28 @@
17
17
  "update-html-data": "node ./scripts/update-html-data.js"
18
18
  },
19
19
  "dependencies": {
20
- "@volar/language-core": "~1.10.0",
21
- "@volar/language-service": "~1.10.0",
22
- "@volar/typescript": "~1.10.0",
20
+ "@volar/language-core": "~1.10.3",
21
+ "@volar/language-service": "~1.10.3",
22
+ "@volar/typescript": "~1.10.3",
23
23
  "@vue/compiler-dom": "^3.3.0",
24
- "@vue/language-core": "1.8.14",
24
+ "@vue/language-core": "1.8.16",
25
25
  "@vue/reactivity": "^3.3.0",
26
26
  "@vue/shared": "^3.3.0",
27
- "volar-service-css": "0.0.13",
28
- "volar-service-emmet": "0.0.13",
29
- "volar-service-html": "0.0.13",
30
- "volar-service-json": "0.0.13",
31
- "volar-service-pug": "0.0.13",
32
- "volar-service-pug-beautify": "0.0.13",
33
- "volar-service-typescript": "0.0.13",
34
- "volar-service-typescript-twoslash-queries": "0.0.13",
35
- "vscode-html-languageservice": "^5.0.4",
36
- "vscode-languageserver-textdocument": "^1.0.8"
27
+ "volar-service-css": "0.0.14",
28
+ "volar-service-emmet": "0.0.14",
29
+ "volar-service-html": "0.0.14",
30
+ "volar-service-json": "0.0.14",
31
+ "volar-service-pug": "0.0.14",
32
+ "volar-service-pug-beautify": "0.0.14",
33
+ "volar-service-typescript": "0.0.14",
34
+ "volar-service-typescript-twoslash-queries": "0.0.14",
35
+ "vscode-html-languageservice": "^5.1.0",
36
+ "vscode-languageserver-textdocument": "^1.0.11"
37
37
  },
38
38
  "devDependencies": {
39
- "@volar/kit": "~1.10.0",
40
- "vscode-languageserver-protocol": "^3.17.3",
41
- "vscode-uri": "^3.0.7"
42
- }
39
+ "@volar/kit": "~1.10.3",
40
+ "vscode-languageserver-protocol": "^3.17.5",
41
+ "vscode-uri": "^3.0.8"
42
+ },
43
+ "gitHead": "f9e281db3f47f9a3f94c79dbbf81102cba01eb5d"
43
44
  }