Recomenda-se a versão v10.15+
de Node e a utilização do gitmoji cli
para as mensagens de commit.
O projeto usa o ESLint para validar o estilo e padrão básico de código. O conjunto de regras do Prettier Style é utilizado.
- Todo o código utiliza ES2015+
- Componentes devem ser CamelCase:
Page.vue
,AuthButton.vue
... - Evitar o uso de
inline style
- Evitar chamadas http dentro de componentes
const
é utilizado preferencialmente.let
é utilizado caso seja possível usarconst
.var
nunca é utilizado.window
deve ser evitado a todo custo, nenhuma váriavel pode ser declarada nele.
Há 3 pastas principais dentro de src/app
: Apps
, Business
e Common
Contém a lógica de apresentação, rotas e componentes de rotas.
Atualmente há auth
e dashboard
, esta estrutura prevê a existencia de backoffice
no futuro.
Regras de negócio (domínios), parte lógica não visual. Módulos do vuex entram nessa camada.
Camada comum entre as outras camadas. Contém componentes úteis ou comuns nas outras camadas. Além de componentes possui funções úteis.
Onde ficam os arquivos para fazer requisição HTTP para a API.
Components que são usados apenas em 1 contexto (ex: Campanhas), fica na mesma pasta da view.
Components comuns que podem ser usados em mais contextos, ficam no @Common/components
.
O arquivo menu.js
é responsável pelas rotas do app (exceto auth) e também pelas routas do Vue.
O campo visible
define se a rota aparece no menu não, inclsuive no submenu.
Para mostrar o texto no topo da página e o ícone, deve se usar:
props:{
icon: "mdi-account-circle",
text: "menu.profile.data"
}
Mas se for um menu apenas para expandir e não direciona para alguma página, deve-se usar sem o props:
text: "menu.profile.expandMenu",
icon: "mdi-account-circle",
No arquivo menu.js
, se o menu possuir submenu, deve ser colocado como children[]
, além de ter um component como layout (podendo ter somente o <router-view>
ou não).
Os seguintes alias estão configurados no projeto.
@assets => src/assets
@utils => src/utils
@Apps => src/app/Apps
@Business => src/app/Business
@Common => src/app/Common
O Yarn é usado para o gerenciamento das dependências. O arquivo yarn.lock deve ser incluído nos commits para garantir builds reprodutíveis.
Para rodar o projeto é necessário um arquivo .env contendo as configurações de locales e as URLs das APIs utilizados. O projeto contém templates para possíveis configurações, nos arquivos .env.*. Para rodar localmente, escolha o arquivo deseja e copie-o para .env. Em produção, o sistema de CI cuida disso automaticamente.
Após clonar o projeto, instalar as dependências com o Yarn e criar o arquivo .env, execute
npm run serve
para rodar em modo de desenvolvimento. Para a build, execute
npm run build
Deve-se seguir o padrão com i18n para internacionalização do projeto.
Os arquivos estão localizados dentro de @Common/locales
.
Key | Value |
---|---|
Font Family | Roboto |
Icon set | Material Design Icons |