vue-antd-admin/assets/js/27.42d11a0b.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[27],{391:function(s,a,n){"use strict";n.r(a);var t=n(18),e=Object(t.a)({},(function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("ContentSlotsDistributor",{attrs:{"slot-key":s.$parent.slotKey}},[n("h1",{attrs:{id:"使用"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#使用"}},[s._v("#")]),s._v(" 使用")]),s._v(" "),n("h2",{attrs:{id:"准备"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#准备"}},[s._v("#")]),s._v(" 准备")]),s._v(" "),n("p",[s._v("你的本地环境需要安装 yarn、node 和 git。我们的技术栈基于 ES2015+、Vue、Antd，提前学习这些知识会非常有帮助。")]),s._v(" "),n("h2",{attrs:{id:"安装"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#安装"}},[s._v("#")]),s._v(" 安装")]),s._v(" "),n("p",[s._v("克隆本项目到本地")]),s._v(" "),n("div",{staticClass:"language-bash line-numbers-mode"},[n("pre",{pre:!0,attrs:{class:"language-bash"}},[n("code",[s._v("$ "),n("span",{pre:!0,attrs:{class:"token function"}},[s._v("git")]),s._v(" clone https://github.com/iczer/vue-antd-admin.git\n")])]),s._v(" "),n("div",{staticClass:"line-numbers-wrapper"},[n("span",{staticClass:"line-number"},[s._v("1")]),n("br")])]),n("p",[s._v("安装依赖")]),s._v(" "),n("div",{staticClass:"language-bash line-numbers-mode"},[n("pre",{pre:!0,attrs:{class:"language-bash"}},[n("code",[s._v("$ "),n("span",{pre:!0,attrs:{class:"token function"}},[s._v("yarn")]),s._v(" "),n("span",{pre:!0,attrs:{class:"token function"}},[s._v("install")]),s._v("\n")])]),s._v(" "),n("div",{staticClass:"line-numbers-wrapper"},[n("span",{staticClass:"line-number"},[s._v("1")]),n("br")])]),n("h2",{attrs:{id:"目录结构"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#目录结构"}},[s._v("#")]),s._v(" 目录结构")]),s._v(" "),n("p",[s._v("我们已经为你生成了一个完整的开发框架，提供了涵盖中后台开发的各类功能和坑位，下面是整个项目的目录结构。")]),s._v(" "),n("div",{staticClass:"language-bash line-numbers-mode"},[n("pre",{pre:!0,attrs:{class:"language-bash"}},[n("code",[s._v("├── docs                     "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 使用文档")]),s._v("\n├── public\n│   └── favicon.png          "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# favicon")]),s._v("\n│   └── index.html           "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 入口 HTML")]),s._v("\n├── src\n│   ├── assets               "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 本地静态资源")]),s._v("\n│   ├── components           "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 业务通用组件")]),s._v("\n│   ├── config               "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 系统配置")]),s._v("\n│   ├── layouts              "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 通用布局")]),s._v("\n│   ├── mock                 "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 本地 mock 数据")]),s._v("\n│   ├── pages                "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 页面组件和通用模板")]),s._v("\n│   ├── plugins              "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# vue 插件")]),s._v("\n│   ├── router               "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 路由配置")]),s._v("\n│   ├── store                "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# vuex 状态管理配置")]),s._v("\n│   ├── theme                "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 主题相关")]),s._v("\n│   ├── utils                "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# js 工具")]),s._v("\n│   └── App.vue              "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 应用入口组件")]),s._v("\n│   └── main.js              "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 应用入口js")]),s._v("\n├── package.json             "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# package.json")]),s._v("\n├── README.md                "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# README.md")]),s._v("\n└── vue.config.js            "),n("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# vue 配置文件")]),s._v("\n")])]),s._v(" "),n("div",{staticClass:"line-numbers-wrapper"},[n("span",{staticClass:"line-number"},[s._v("1")]),n("br"),n("span",{staticClass:"line-number"},[s._v("2")]),n("br"),n("span",{staticClass:"line-number"},[s._v("3")]),n("br"),n("span",{staticClass:"line-number"},[s._v("4")]),n("br"),n("span",{staticClass:"line-number"},[s._v("5")]),n("br"),n("span",{staticClass:"line-number"},[s._v("6")]),n("br"),n("span",{staticClass:"line-number"},[s._v("7")]),n("br"),n("span",{staticClass:"line-number"},[s._v("8")]),n("br"),n("span",{staticClass:"line-number"},[s._v("9")]),n("br"),n("span",{staticClass:"line-number"},[s._v("10")]),n("br"),n("span",{staticClass:"line-number"},[s._v("11")]),n("br"),n("span",{staticClass:"line-number"},[s._v("12")]),n("br"),n("span",{staticClass:"line-number"},[s._v("13")]),n("br"),n("span",{staticClass:"line-number"},[s._v("14")]),n("br"),n("span",{staticClass:"line-number"},[s._v("15")]),n("br"),n("span",{staticClass:"line-number"},[s._v("16")]),n("br"),n("span",{staticClass:"line-number"},[s._v("17")]),n("br"),n("span",{staticClass:"line-number"},[s._v("18")]),n("br"),n("span",{staticClass:"line-number"},[s._v("19")]),n("br"),n("span",{staticClass:"line-number"},[s._v("20")]),n("br"),n("span",{staticClass:"line-number"},[s._v("21")]),n("br")])]),n("h2",{attrs:{id:"本地开发"}},[n("a",{staticClass:"header-anchor",attrs:{href:"#本地开发"}},[s._v("#")]),s._v(" 本地开发")]),s._v(" "),n("p",[s._v("启动服务")]),s._v(" "),n("div",{staticClass:"language-bash line-numbers-mode"},[n("pre",{pre:!0,attrs:{class:"language-bash"}},[n("code",[s._v("$ "),n("span",{pre:!0,attrs:{class:"token function"}},[s._v("yarn")]),s._v(" serve\n")])]),s._v(" "),n("div",{staticClass:"line-numbers-wrapper"},[n("span",{staticClass:"line-number"},[s._v("1")]),n("br")])]),n("p",[s._v("启动成功后，会看到一个本地预览地址，通常是 http://localhost:8080 。接下来就可以修改代码，并实时预览修改结果啦！")])])}),[],!1,null,null,null);a.default=e.exports}}]);