/vue-vite-element-plus-starter

A powerful and efficient starter template for web development, integrating Vue3, Vite4, Element-Plus, Pinia, with built-in Docker, Nginx, ESLint, and commitlint configurations.

Primary LanguageTypeScriptMIT LicenseMIT

English Version

vue-vite-element-plus-starter

一、项目介绍

在线文档

二、启动文档

全局安装 docsify-cli

# MacOS `sudo npm install -g docsify-cli`
npm install -g docsify-cli

启动 docs

npm run docs

访问文档 http://localhost:3000

三、启动项目

安装依赖

# npm install --registry=https://registry.npm.taobao.org
npm install

开发环境

npm run dev

四、打包项目

联调环境

npm run rd

测试环境

npm run qa

生产环境

npm run prod

五、ESlint 修复代码

执行下面命令，将会自动修复代码

npm run lint

六、生成 changelog

生成 /CHANGELOG.md

npm run changelog

生成 /docs/CHANGELOG.md

npm run changelog-docs

七、构建部署

docker-compose build
docker-compose up -d

http://localhost:8000

八、Recommended IDE Setup

VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).

九、Type Support for .vue Imports in TS

TypeScript cannot handle type information for .vue imports by default, so we replace the tsc CLI with vue-tsc for type checking. In editors, we need TypeScript Vue Plugin (Volar) to make the TypeScript language service aware of .vue types.

If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a Take Over Mode that is more performant. You can enable it by the following steps:

  1. Disable the built-in TypeScript Extension
    1. Run Extensions: Show Built-in Extensions from VSCode's command palette
    2. Find TypeScript and JavaScript Language Features, right click and select Disable (Workspace)
  2. Reload the VSCode window by running Developer: Reload Window from the command palette.

十、Customize configuration

See Vite Configuration Reference.