### Install Frontend Dependencies Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Installs the Node.js dependencies for the frontend project using pnpm. ```cmd pnpm i ``` -------------------------------- ### Install Backend Dependencies Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Installs the necessary Node.js dependencies for the backend project using npm. ```cmd npm i ``` -------------------------------- ### Start Frontend Development Server Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Starts the frontend development server, typically using Vite or Vue CLI, for local development. ```cmd npm run dev ``` -------------------------------- ### Start Backend Development Server Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Starts the backend development server in watch mode, automatically restarting on file changes. ```cmd npm run start:dev ``` -------------------------------- ### Clone Backend from GitHub Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Clones the isme-nest-serve backend repository from GitHub. ```cmd git clone https://github.com/zclzone/isme-nest-serve.git ``` -------------------------------- ### Install pnpm Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Installs the pnpm package manager globally using npm. pnpm is recommended for managing project dependencies. ```sh npm i -g pnpm ``` -------------------------------- ### Clone Backend from Gitee Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Clones the isme-nest-serve backend repository from Gitee. ```cmd git clone https://gitee.com/isme-admin/isme-nest-serve.git ``` -------------------------------- ### Clone Frontend from GitHub Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Clones the Vue Naive Admin frontend repository from GitHub. The '-b 2.x' flag specifies the branch to clone. ```cmd git clone -b 2.x https://github.com/zclzone/vue-naive-admin.git ``` -------------------------------- ### Clone Frontend from Gitee Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/01-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B Clones the Vue Naive Admin frontend repository from Gitee. The '-b 2.x' flag specifies the branch to clone. ```cmd git clone -b 2.x https://gitee.com/isme-admin/vue-naive-admin.git ``` -------------------------------- ### Start Backend Service with PM2 Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Command to start the backend service using PM2, a process manager for Node.js applications. It includes options for naming the process and watching for file changes. ```cmd pm2 start -n nest-jwt ./index.js --watch ``` -------------------------------- ### Build Backend Locally Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Command to build the backend project. This process bundles dependencies into a single executable file. ```cmd pnpm build ``` -------------------------------- ### Backend Environment Configuration Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Example `.env` file for backend configuration, including database credentials, JWT secret, and other runtime settings. This file should be adapted to the specific server environment. ```env DB_HOST=localhost DB_PORT=3306 DB_USER=admin DB_PWD=123456 DB_DATABASE=isme DB_SYNC=true JWT_SECRET="xxxxxx" IS_PREVIEW=false ``` -------------------------------- ### Preview Backend Locally Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Command to run the built backend application locally. It executes the bundled JavaScript file. ```cmd node ncc-dist/index.js ``` -------------------------------- ### Build Frontend Locally Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Command to build the frontend project for local deployment. This command generates production-ready static files. ```cmd pnpm build ``` -------------------------------- ### Preview Frontend Locally Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Command to preview the frontend build locally. This uses Vite's preview server, which respects proxy configurations in vite.config.js. ```cmd pnpm preview ``` -------------------------------- ### Nginx Proxy Configuration for API Requests Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Example Nginx configuration to proxy API requests to a backend server running on localhost:8085. It includes essential headers for proper request forwarding. ```nginx location ^~ /api/ { proxy_pass http://localhost:8085/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header X-Forwarded-Proto $scheme; } ``` -------------------------------- ### Vue Naive Admin Frontend Stack Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet outlines the core frontend technologies used in Vue Naive Admin, highlighting its modern Vue 3 setup with Vite for fast development, Pinia for state management, and Unocss for atomic CSS. ```Vue Vite + Vue3 + Pinia + Unocss ``` -------------------------------- ### Nginx Configuration for History Mode Routing Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 Nginx configuration snippet to resolve 404 errors for applications using history mode routing by redirecting unmatched requests to index.html. ```nginx location / { try_files $uri $uri/ /index.html; } ``` -------------------------------- ### Vercel Rewrite Configuration for History Mode Source: https://isme.top/guide/01-%E6%8C%87%E5%8D%97/02-%E6%9E%84%E5%BB%BA%E9%83%A8%E7%BD%B2 JSON configuration for Vercel to handle 404 errors with history mode routing by rewriting all routes to index.html. ```json { "rewrites": [ { "source": "/(.*)", "destination": "/index.html" } ] } ``` -------------------------------- ### Vue Naive Admin Backend Source Code (Gitee) Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D Provides the Gitee repository link for the Nestjs backend source code of Vue Naive Admin. ```Link isme-nest-serve | gitee ``` -------------------------------- ### Vue Naive Admin Backend Source Code (GitHub) Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D Provides the GitHub repository link for the Nestjs backend source code of Vue Naive Admin. ```Link isme-nest-serve | github ``` -------------------------------- ### Vue Naive Admin Icon Integration Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet describes the icon solution used in Vue Naive Admin, which leverages Iconify and Unocss for flexible and efficient icon management, including support for custom icons and dynamic rendering. ```Vue iconify + unocss ``` -------------------------------- ### Vue Naive Admin UI Framework Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet highlights the use of Naive UI in Vue Naive Admin, emphasizing its contribution to a minimalist code style, clean page design, and easy theme customization. ```Vue Naive UI ``` -------------------------------- ### Vue Naive Admin Global Utilities Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet explains the global utility methods encapsulated using Naive UI in Vue Naive Admin, such as message notifications that support batch alerts and cross-page singleton patterns. ```Vue 基于 Naive UI 封装 message 全局工具方法 ``` -------------------------------- ### Vue Naive Admin Reusable Components Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet lists common business components built with Naive UI in Vue Naive Admin, including Page, CRUD Table, and Modal components, designed to simplify development and reduce repetitive tasks. ```Vue 基于 Naive UI 封装常用的业务组件,包含 Page 组件、CRUD 表格组件及 Modal 组件等 ``` -------------------------------- ### Vue Naive Admin Routing Design Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet explains the routing approach in Vue Naive Admin, featuring a flat routing design that allows any component to be a page and simplifies KeepAlive implementation. It also mentions dynamic route generation based on permissions. ```Vue 扁平化路由 ``` -------------------------------- ### Vue Naive Admin Backend Stack Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet details the backend technologies provided with Vue Naive Admin, which includes Nestjs for the framework, TypeOrm for data access, and MySql as the database. It also mentions built-in JWT and RBAC functionalities. ```Nestjs Nestjs + TypeOrm + MySql ``` -------------------------------- ### Vue Naive Admin Authentication Refresh Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet describes the implementation of seamless token refresh using Redis in Vue Naive Admin, focusing on user session control, security, and user experience. ```Vue 基于Redis集成 无感刷新 ``` -------------------------------- ### Vue Naive Admin Permission Routing Source: https://isme.top/guide/%E9%A1%B9%E7%9B%AE%E4%BB%8B%E7%BB%8D This snippet details how Vue Naive Admin handles routing based on permissions, enabling dynamic route generation and distinguishing between 403 (Forbidden) and 404 (Not Found) errors. ```Vue 基于权限动态生成路由 ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.