As principais tecnologias utilizadas neste sistema são as seguintes:
Vue3
Atualização de 19/11/2022
Nova filial Vue3, já a filial padrão desenvolvida por
zerotower69
;
Atualização de 15/03/2023
vue3 é o ramo principal. Para a versão vue2, consulte o ramo vue2. Este ramo atualmente tem muitas armadilhas. Para algumas imperfeições, consulte o efeito da versão vue2.
administrador --- gerenciamento de back-end
web---exibição da recepção
servidor --- serviço de back-end
O sistema está online para exibição
Exibição do portal empresarial (https://xanadu.aerowang.cn/)
Gerenciamento de segundo plano do sistema (https://xanadu.aerowang.cn/admin)
Conta: youke, senha: a123456
Administrador: admin Senha: 654321
Você também pode se cadastrar em
Se houver um problema, dê uma olhada nos scripts em package.json. Você pode ver que os comandos dev e running são criados do nada.
npm install
npm run start(本地启动)
或者 npm run dev(实时监听改动重启,边改边跑) 需要全局安装 nodemon(任何说不是xxx命令的错误都是没有全局安装,请先安装后再运行)
# 1.安装
npm install
#又或者
pnpm install
# 2.启动
npm run serve
#又或者
pnpm serve
# 3.打包
npm run build
#又或者
pnpm build
# 4.清除 node_modules
npm run clear
# 又或者
pnpm clear #由于rmdir 安装在这里,它也会清掉,就是自己干了自己
#会有一条报错出现,请无视它
Instale o comando pnpm globalmente com antecedência
npm i pnpm -g
Implantação automática do Docker com um clique
Ordem
# 主目录下
docker compose up -d
# 即可访问
Os seguintes arquivos precisam ser alterados:
./admin/.env.production
VUE_APP_BASE_API = '你自己的域名:3000/api/v1'
./admin/vue.config.js
linha.27 publicPath: '/',
=> publicPath: '/admin/',
./server/config/dbinfo.js
host: "localhost",
=> host: "xanadu-db",
./web/.env.production
VUE_APP_PRODURL = "你自己的域名/admin/#/login"
./web/src/utils/request.ts
baseURL: '/api'
=>你自己的域名:3000/api
docker não está usando a versão go
Como este sistema otimizou os recursos de carregamento do CDN, você deve se conectar a uma rede relativamente rápida e estável para executar este sistema, caso contrário, alguns erros aparecerão na página do sistema!
Atualização de 19/11/2022
Algumas referências de recursos vêm de cdn.jsdelivr.net Atualmente (2022.11.19) o acesso pode ser um pouco lento. Se estiver interessado, você mesmo pode modificar o link de referência.
Atualização de 15/03/2023
1. Certifique-se de fazer cd nos respectivos diretórios para execução. Para ser mais preciso, este sistema está dividido em três projetos: front-end, back-end e gerenciamento de front-end. Este diretório raiz não pode ser executado diretamente.
2. Verifique rigorosamente a versão do seu nó. Diante dos problemas descobertos, no ambiente Windows, recomenda-se a utilização da versão maior do nó 14. Além disso, o arquivo de grupo do grupo QQ fornece um pacote compactado de pacotes dependentes, que também pode ser utilizado como; uma tentativa; os sistemas mac 14 e 16 estão OK (rodando em APPLE acima de M1).
3. Se o erro de conexão do banco de dados for relatado, primeiro verifique se a configuração de dbinfo.js no diretório de configuração no servidor (nó backend) e a configuração de seu próprio banco de dados estão corretas.
4. Antes de executar o projeto, certifique-se de npm install para instalar as dependências relevantes e vá para o final pcweb, final de gerenciamento e backend para ver seus respectivos arquivos package.json, olhar a seção de scripts e confirmar isso o comando que você deseja executar foi definido. Não há nenhum comando dev definido. Se você deseja executar npm run dev
, um erro será definitivamente relatado e a primeira mensagem de erro significa que dev não está em scripts. De qualquer forma, você verá as duas palavras-chave package.json e scripts aparecendo. . A primeira linha do seu relatório de erros deve indicar que um comando indefinido foi executado.
5. Para o script do banco de dados (initial_data.sql), consulte o grupo QQ: 434063310 (o proprietário deste grupo não é o autor original, mas o mantém voluntariamente).
6. Node recomenda usar a ferramenta de gerenciamento de versão nvm. Os usuários do Windows podem usar .exe diretamente para instalar sem se preocupar.
brew install nvm
Depois de instalar o nvm, você pode usá-lo para alternar as versões do nó. nvm install xxx é o comando de instalação. Lembre-se de usar nvm use xxx para mudar para a versão que deseja usar sempre que mudar.
7. O projeto web usa CDN. Se você não quiser usá-lo, comente a lógica na configuração externa, se for usado, verifique se o link relevante do CDN pode ser acessado normalmente. navegador e você pode verificá-lo e corrigi-lo Configure seu externo.
8. Em relação ao uso de proxy, certifique-se de configurar o proxy reverso no nginx no ambiente de produção.
9. Atualmente, não há solução de empacotamento adequada para o nó de back-end. Geralmente, o servidor usa pm2 diretamente para iniciar o serviço do nó. Instale o pm2 no servidor e use:
npm i pm2 -g
Se você realmente precisa empacotá-lo, verifique o artigo em Zhihu A qualidade do Baidu não é boa. Mas o conceito de empacotamento aqui é diferente daquele de java. Mesmo se você usar webpack para empacotamento, seu código ainda será js em vez de ser convertido em bytecode pelo compilador como java. a O tempo de execução do JavaScript não é uma linguagem nova, apenas o kernel V8 escrito em C++ fornece essas APIs de nó. A linguagem real responsável pela interação com o sistema é C++.
10. Iniciantes, por favor, estejam cientes do propósito do empacotamento front-end. O código que estamos escrevendo atualmente não pode ser executado diretamente pelo navegador. Precisamos convertê-lo em um formato que o navegador possa reconhecer e executar. é js para outro js O processo de padronização é completamente diferente do empacotamento no sentido de back-end.
11. Para problemas de caminho de imagem, tente usar seu próprio serviço CDN ou coloque os recursos em seu próprio servidor para substituir o caminho de imagem que já existe no banco de dados.
UPDATE [tablename] SET [fieldname] = REPLACE([fieldname], ' locolhost:3000 ' , ' [yourHOST] ' )
Os recursos de imagem não requerem proxy reverso nginx. Você pode consultar a seguinte configuração:
location ~ .*.(gif|jpg|jpeg|png|bmp|swf|webp|jfif)$
{
#图片在server/static里,改写root路径就可以了!
root /www/wwwroot/zero/company/server/static;
expires 30d ;
error_log /dev/null;
access_log /dev/null;
}
12. Ao encontrar uma mensagem de erro, não fique chateado se a vir em inglês. Por exemplo, se houver "chave estrangeira" no erro de back-end, deve haver um problema com a chave estrangeira. Verifique a definição do modelo ou a definição do banco de dados ou os dados. Front-end Vue é indefinido. Este problema está principalmente relacionado ao uso incorreto de cdn. Comentário vue.config.js (vue3) já existem instruções. Se houver muitos erros em inglês, não os leia. Não é difícil abrir o Youdao (o Google é mais recomendado) e traduzi-los.
14. Se você precisar adicionar novas funções, é recomendável ler o código primeiro. Na verdade, o código não é difícil. O design funcional não possui recursos especiais. É impossível copiar esta parte do código. Só pode ser sua criação original. Se você não entende a parte do código, você pode postar uma foto para fazer perguntas ( certifique-se de postar uma foto ). Se você não olhar o código por um tempo, você esquecerá de postar uma foto. fazer perguntas pode garantir que sua confusão possa ser respondida a tempo.
Espero que todos possam não apenas saber como utilizar este projeto a partir da documentação, mas também adquirir habilidades relevantes para que possam progredir no front-end. Vendo isso, por que você não me dá uma estrela? Deixe sua estrela para outra prostituta (cachorro).
Lembre-se de dar estrela ღ(´・ᴗ・`)~ Novo grupo: 434063310. (A pontualidade da resposta não é garantida)
1. A intenção original do projeto é permitir que todos tenham uma comparação de sintaxe da versão vue3, de forma que muitas funções sejam consistentes com o branch vue2. Como os bugs são inevitáveis no desenvolvimento, consulte a ramificação vue2 ou implante modificações de versão, se necessário. 2. Não sou responsável pela experiência de ninguém. Se você tiver algum bug, fique à vontade para me fazer perguntas, mas não sou professor. O professor que você precisa pode ser: