vue3.0 admin

vue3-admin

Perkenalan

vue3-admin adalah tampilan halaman front-end dari sistem manajemen backend, yang dibangun dan diimplementasikan oleh vue-cli4 dan elemnet-ui. Kerangka kerja Vue terbaru digunakan, dan model pengembangan berbasis komponen diadopsi secara internal, sehingga setiap komponen sebisa mungkin mengikuti prinsip fungsi tunggal. Walaupun awalnya terkesan sedikit melelahkan (karena sub-komponennya hanya berfungsi tunggal, sehingga banyak komunikasi internal), namun memiliki manfaat yang besar untuk pemeliharaan selanjutnya. Proyek ini menggunakan tata letak kotak yang fleksibel (fleksibel), sehingga juga memiliki efek tampilan yang lebih baik di terminal seluler. Anda dapat membuka demo di terminal seluler untuk dilihat.

Server telah habis waktunya dan belum diperbarui. Telah dimatikan dan saat ini tidak dapat dipratinjau. Jika Anda tertarik, silakan tarik kodenya dan jalankan sendiri.

Demo (karena versi konfigurasi rendah dari server Alibaba Cloud yang dibeli oleh penulis sendiri, waktu permintaan mungkin sedikit lebih lama)

Demo daring

Anda dapat memindai kode QR di terminal seluler untuk melihatnya

Untuk pengalaman pengembangan yang lebih cepat dan lebih baik, lihat proyek di bawah ini

proyek praktis vue3

mengembangkan

 # 克隆项目
git clone [email protected]:guodonglw/vue3.0-admin.git

# 进入项目目录
cd vue3.0-admin

# 安装依赖
npm install

# 建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run serve

# 如遇到node-sass的问题，可尝试
npm rebuild node-sass

Akses peramban http://localhost:8080

melepaskan

 # 构建生产环境
npm run build

Folder dist akan muncul saat pengemasan, buka saja halaman index.html dengan browser Chrome

Dukungan browser

Browser modern

Firefox	krom	Safari
2 versi terakhir	2 versi terakhir	2 versi terakhir

Komentar

 // 建议首先查看路由文件(了解项目路由以及如何进行动态生成前端路由)
// 页面查看顺序(登录页（views/Login）-> 首页(views/Home/Dashboard))，其中views/Home为其他页面的公共引用部分
// 与后端交互接口（请查看service/index.ts，数据由mock.js产生；实际开发请查看util/request.ts）
// 后台系统包括了登录，异步生成路由，echarts数据可视化，table表增删改查等功能，希望该demo示例可以帮助到有需要的朋友快速上手
// 根据vue-cli示例，主页面index.vue中会采用vue2的写法，在子组件中则有较大的变化，请仔细查看区别