This template includes the following packages:
這模板整合了以下套件
- Vue 3 - The Progressive JavaScript Framework.
- TypeScript - TypeScript extends JavaScript by adding types.
- Vue I18n - Vue I18n is internationalization plugin for Vue.js
- Dayjs - Fast 2kB alternative to Moment.js with the same modern API
- @vitejs/plugin-legacy -This plugin provides support for legacy browsers that do not support native ESM when building for production.
- ESLint - Find and fix problems in your JavaScript code
- Stylelint - A mighty, modern linter that helps you avoid errors and enforce conventions in your styles.
- Axios - Promise based HTTP client for the browser and node.js
- TailwindCSS - Rapidly build modern websites without ever leaving your HTML
- Vue Test Utils - Vue Test Utils is the official unit testing utility library for Vue.js.
- Vitest - A Vite-native testing framework. It's fast!
- Testing Library - Simple and complete testing utilities that encourage good testing practices
- TestCafe - A node.js tool to automate end-to-end web testing
請先安裝好 Node.js 環境
This Demo project is running on Node.js (16.17.0), NPM (8.15.0) while testing.
- Clone this repository to your local machine
- Start your development
$ git clone https://github.com/andy922200/vite-vue3-ts-template.git
1. Enter the project folder
> Open a new terminal window and enter the folder
$ cd <project folder>
2. Install packages via pnpm
$ pnpm install
3. Compiles the webpack for development
$ pnpm dev // port:8080
4. Fix the coding style automatically ( js / html )
$ pnpm lint-fix
5. Fix the css coding style automatically
$ pnpm format-css
6. Execute Unit Testing
$ pnpm test-vitest
7. Execute E2E Testing
$ pnpm test-e2e