概要
オープンソース プロジェクト、Bilibili プロジェクト、企業プロジェクトのいずれであっても、誰もがVue3 プロジェクト テンプレートに触れる可能性があります。会社のテンプレートと Vue-pure-admin のオープンソース テンプレートを見ても、いつも中途半端な理解状態だったので、苦労して学び、自分で一から構築することにしました。これ！！！
今回構築したプロジェクトには、vue-routerの利用とモジュール化、piniaの利用とモジュール化、Element-Plusコンポーネントの導入、一部のコンポーネント(uploadアップロードコンポーネントなど)の2次パッケージ化など、プロジェクトテンプレートの共通機能が含まれます。、メニュー メニューコンポーネント、ブレッドクラムコンポーネント）、中国語と英語の切り替え、ワンクリックスキン変更、echartsの使い方とデータ視覚化の大画面実践、svgコンポーネントのカプセル化とその使い方など...。皆さんのお役に立てればと思い、すべての重要な手順をブログの形式で紹介します。
技術スタック: Vue3 Family Bucket (Vue3.0 + TypeScript + Vite + Pnina + Element+Plus)
環境: Node.js (V16.14.0)
期待 :共通機能を含む Vue3.0 バックグラウンド管理システムの完成
ブログ: 10 件のアップデートが完了しましたこれまでに作成した残りの記事、プロジェクトが構築されるにつれて、
参照のためにブログが更新され続けます: Vue-Pure-Admin: https://yiming_chang.gitee.io/pure-admin-doc/
1. 連載記事集（随時更新～）
- Vue3+Ts+Vite プロジェクト (パート 1) - Vite を使用して Vue3 プロジェクトを作成する
- Vue3+Ts+Vite プロジェクト (パート 2) - Element-Plus の紹介と、オンデマンドで自動的にインポートするコンポーネントの構成
- Vue3+Ts+Vite プロジェクト (パート 3) - husky、stylelint、commitlint を構成し、コード検証を送信するように git を構成する
- Vue3+Ts+Vite プロジェクト (パート 4) - @ パス エイリアスを構成し、/src の代わりに @ を実装する
- Vue3+Ts+Vite プロジェクト (パート 5) - ルーティング ジャンプを実装し、ルーティングのモジュール化を完了するようにルーターを構成する
- Vue3+Ts+Vite プロジェクト (パート 6) - ルート読み込みプログレス バーを実装するための nprogress のインストールと使用
- Vue3+Ts+Vite プロジェクト (パート 7) - カスタム スクロール バー スタイル
- Vue3+Ts+Vite プロジェクト (その8) - ページ切り替えトランジションアニメーション
- Vue3+Ts+Vite プロジェクト (パート 9) - el-menu に基づいた左側のメニュー バー コンポーネントのカプセル化
- Vue3+Ts+Vite プロジェクト (パート 10) - パンくずリスト コンポーネントとパンくずリストの遷移アニメーションを実装するための el-breadcrumb の二次カプセル化
- Vue3+Ts+Vite プロジェクト (その 11) - プロジェクト起動時のロード効果
- Vue3+Ts+Vite プロジェクト (パート 12) - echarts のインストールと使用、vue3 プロジェクトの echarts コンポーネントのパッケージ化
- Vue3+Ts+Vite プロジェクト (パート 13)—Element-Plus のテーマ カラーの構成
- Vue3+Ts+Vite プロジェクト (パート 14) - vue-i18n をインストールし、中国語と英語の切り替えを設定して国際化を完了します
- Vue3+Ts+Viteプロジェクト（その15） - tailwindcssのインストールと使い方、css原子化の実現方法を詳しく解説
2. プロジェクトのレンダリング
2.1 ログインして登録する
2.2 ホームページ
2.3 中国語と英語の切り替え
