Suporte a IDE

mdui é otimizado especificamente para VS Code e WebStorm, fornecendo recursos como autocompletar código, dicas ao passar o mouse, etc., nessas IDEs.

VS Code

mdui instalado via npm

Se você instalou o mdui via npm, siga as etapas abaixo para ativar o suporte a IDE do VS Code no projeto atual:

1. Crie o diretório .vscode na raiz do projeto.
2. Crie o arquivo settings.json no diretório .vscode.
3. Adicione o seguinte código ao arquivo settings.json:

   {
     "html.customData": ["./node_modules/mdui/html-data.en.json"],
     "css.customData": ["./node_modules/mdui/css-data.en.json"]
   }
   

Se o arquivo settings.json já existir, basta adicionar as duas linhas de código acima ao nó raiz do documento JSON. Após a modificação, reinicie o VS Code.

mdui usado via CDN

Se você está usando mdui via CDN, pode obter suporte a IDE instalando a extensão do mdui para VS Code.

Procure por mdui na loja de extensões do VS Code e selecione o primeiro resultado para instalar, ou clique aqui para instalar. Após a instalação, todos os projetos terão suporte a IDE do mdui.

Recomenda-se instalar via npm e configurar o arquivo settings.json em vez de instalar a extensão do VS Code, para garantir que o suporte a IDE esteja alinhado com a versão do mdui em uso.

WebStorm

mdui instalado via npm

Se você instalou o mdui via npm, siga as etapas abaixo para ativar o suporte a IDE do WebStorm no projeto atual:

1. Adicione o seguinte código ao nó raiz do arquivo package.json na raiz do projeto:

   {
     "web-types": ["./node_modules/mdui/web-types.en.json"]
   }
   

Se o nó raiz do arquivo package.json já tiver a propriedade web-types, basta adicionar ./node_modules/mdui/web-types.en.json ao array web-types. Após a modificação, reinicie o WebStorm.

mdui usado via CDN

Se você está usando mdui via CDN, pode obter suporte a IDE instalando o plugin do mdui para WebStorm.

Procure por mdui na loja de plugins do WebStorm e selecione o primeiro resultado para instalar. Após a instalação, todos os projetos terão suporte a IDE do mdui.

Recomenda-se instalar via npm para obter suporte a IDE em vez de instalar o plugin do WebStorm, para garantir que o suporte a IDE esteja alinhado com a versão do mdui em uso.

Diferenças de suporte entre VS Code e WebStorm

O suporte do mdui para VS Code e WebStorm tem algumas diferenças. A tabela abaixo lista as diferenças detalhadas: