vue spa starter

sistema de múltiplas páginas únicas

Este sistema foi migrado para a compilação vue-cli-service e pode ser usado imediatamente.

sugestão

• Ambiente: >=node8 + fio
• Editor: vscode

começar

yarn # npm i
yarn run dev # 默认入口为src/pages/*/index.js

Configuração do ambiente

.env # 默认配置
.env.local # gitignore，会merge .env
.env.prod
.env.prod.local # gitignore，会merge .env.prod 

CommitLint

De acordo com o tipo de especificação geral

• talento: nova função (recurso)
• consertar: consertar bug
• documentos: documentação
• estilo: ajuste de estilo
• refatorar: refatorar uma função
• teste: adicionar teste
• tarefa: alterações no processo de construção ou ferramentas auxiliares
• desempenho: otimização de desempenho
• reverter: reverter commit

 # type: 提交类型  scope: 变动范围  type为必需，scope选填
# git commit -m '${type}(${scope}): some message'
git commit -m ' feat: 增加 xxx 功能'
git commit -m ' fix: 修复 xxx 功能'
git commit -m ' fix(UserController): [bug005]修复用户权限问题' 

Eslint

Modificado por .eslintrc.js

• 0 desabilitar
• 1 aviso
• 2 erros

Especificações de código

• https://github.com/airbnb/javascript
• Arquivos .vue e pastas relacionadas são nomeados em letras minúsculas, separados por - , por exemplo: button-group

Observação

• js polyfill foi introduzido globalmente no cdn por meio de html e não há necessidade de usar babel-polyfill ou transform-runtime para resolver o problema.
• Personalize o tema element-ui através de ~/src/styles/element-theme.scss
• Estilos comuns são escritos em ~/src/styles/${THEME}/app.scss
• As principais variáveis ​​de estilo são nomeadas em ~/src/styles/${THEME}/variables.scss . Os estilos dos componentes unificam o tema por meio de variáveis ​​definidas.
• A biblioteca de ícones foi colocada em https://www.iconfont.cn/ (atualmente na conta github/evanliu2968)
• https://serverfault.com/questions/506972/nginx-why-i-cant-put-proxy-set-header-inside-an-if-clause

Aprimorar projeto

Gráfico

• gráficos eletrônicos
• ~/src/components/common/vue-echarts

carregar

• components/common/file-upload ie10+ upload de FormData, upload de iframe ie9

transmissão criptografada

• https://blog.csdn.net/baidu_22254181/article/details/82594072
• Atualmente a criptografia simétrica AES é usada, ~/src/libs/auth.js

webappck

• Babel não transpila arquivos em node_modules por padrão e precisa ser declarado em ~vue.config.js/transpileDependencies
• new webpack.ContextReplacementPlugin(/moment[\/]locale$/, /^./(zh-cn)$/) remove outros pacotes de idiomas (o pacote compactado tem mais de 300 kb)
• É muito problemático introduzir um único gráfico echarts (código fonte 2M+, pacote compactado 600kb Use js em HTML para evitar empacotamento sempre).

Ambiente de servidor

endereço de configuração do nginx: cd /etc/nginx/vhost Após a modificação, você precisa reiniciar o nginx e usar o comando docker para reiniciar e recarregar o arquivo de configuração: docker exec nginx nginx -s reload Verifique o arquivo de configuração: docker exec nginx nginx -t

Outros documentos do processo

• Processo de liberação do ambiente.md
• Ambiente de desenvolvimento local executando process.md