Introdução
O Vue3 é a terceira versão do framework VueJS que é um framework Javascript open source muito versátil e muito utilizado no mercado.
É um framework modular, de fácil aprendizagem e com ele você pode criar desde aplicações pequenas até aplicações de grande escala.
Existem algumas formas de fazer a criação do projeto Vue, vou mostrar como fazer utilizando o vue-cli.
Vue-cli
O vue-cli é uma ferramenta de linha de comandos que foi criada pela comunidade do VueJS para facilitar a criação de projetos.
Ela pode criar aplicações com configurações pré definidas ou também você pode selecionar quais configurações deseja.
Instalar/atualizar vue-cli
Caso você não tenha o vue-cli instalado, você pode fazer a instalação com o comando:
npm install -g @vue/cli
# ou
yarn global add @vue/cli
# utilize somente um desses, eu prefiro trabalhar com o NPM
Caso você já tenha instalado, para utilizar o Vue3 você precisará ter o vue-cli na versão 4.5 ou maior.
Para verificar a versão do seu vue-cli, utilize o comando:
vue --version
E para atualizar o vue-cli para a versão mais recente use o comando:
npm update -g @vue/cli
# ou
yarn global upgrade --latest @vue/cli
Obs: se estiver utilizando linux pode precisar rodar esse comando com sudo.
Criar projeto Vue3
Para criar o projeto, no terminal utilize o comando:
vue create nome_do_projeto
Com esse comando vai aparecer uma lista de opções para você selecionar.
A opção “Default (Vue 3) ([Vue 3] babel, eslint)” irá trazer uma aplicação Vue3 pré configurada com babel e eslint. Assim que selecionar já irá começar o processo de instalação.
Caso você queira selecionar as opções que você deseja na aplicação, como por exemplo se você quer vue-router, vuex, typescript e outras opções, selecione “Manually select features”.
Dessa opção surgirá outras novas, você precisa deixar marcado “Choose Vue Version” para selecionar a versão do Vue, e depois você poderá selecionar Vue3.
Você pode ir navegando com as setas entre as opções, e para marcar uma opção desejada, utilize o espaço.
Após selecionar todas as opções o vue-cli começará a configurar o projeto, essa etapa pode demorar.
Depois de todo o tempo de espera você pode entrar no diretório do projeto e rodar ele normalmente:
cd nome_do_projeto
npm run serve
# ou
yarn serve
E pronto, você já terá um projeto zerado com o Vue na versão 3 para utilizar.
Em breve irei trazer mais conteúdos sobre o Vue3.
Para ver outros canais onde o posto conteúdo sobre HTML, CSS e Javascript, veja os Links do Programando Soluções.
Conclusão
Com esse post você aprendeu a criar um projeto com o Vue3 e com isso você consegue utilizar as novas features do framework.
Referências
https://v3.vuejs.org/guide/installation.html#cli
https://ichi.pro/pt/criando-seu-primeiro-projeto-vue3-um-tutorial-vue-135909568102813
https://blog.geekhunter.com.br/vue-js-so-vejo-vantagens-e-voce/
https://medium.com/trainingcenter/criando-um-projeto-vuejs-com-o-vuecli-e-webstorm-58b695339c01#:~:text=Vue%20CLI%20%C3%A9%20uma%20ferramenta,tempo%20de%20configura%C3%A7%C3%A3o%20de%20ambiente.