项目介绍小编发这篇博客的目的是使用PanJiaChen和elunez的vue-element-admin，并基于这两个发布大咖Guy的前端模板编写文档。本博客预计发布周期为3个月，预计发布次数为30-50篇。希望各位观众多多点赞，多多点赞，多多评论。特此说明一下技术栈本项目采用Vue+ElementUI+axios+Vue-Router+Vuex。关于技术选型，我会在下一篇文章中单独说明。1.安装Node下载地址：https://nodejs.org/en/download/注：下载LTS版本。即LongTermSupport：长期支持版本安装配置成功：node-vnpm-v2。安装webpackwebpack官网文档：https://www.webpackjs.comnpminstall--save-devwebpack注意：不建议全局安装webpack。这会将您项目中的webpack锁定为指定版本，并可能导致使用不同webpack版本的项目构建失败。安装配置成功：webpack-v3。安装vue-cli旧版VueCLI的包名由vue-cli改为@vue/cli。如果您全局安装了旧版本的vue-cli（1.x或2.x），您需要先通过npmuninstallvue-cli-g或yarnglobalremovevue-cli卸载它。npminstall-g@vue/cli成功安装和配置：vue-V4.初始化项目vueinitwebpack5.启动项目cdvue-admin-platformnpmrundev6。查看项目目录├──build//构建相关├──config//配置相关├──node_modules//npm模块├──src//源码。这是我们关注的├──static//第三方不打包资源├──.babelrc//babel-loader配置├──eslintrc.js//eslint配置项├──.gitignore//git忽略项├──index.html//html模板└──package.json//package.json└──README.md//文档说明7.新建工程目录如下：├──build//构建相关├──config//配置相关├──src//源代码│├──api//所有请求│├──assets//主题字体等静态资源││├──img//静态图片││├──css//css文件│├──components//全局公共组件│├──directive//全局指令│├──filterres//全局过滤器│├──icons//项目的所有svg图标│├──lang//国际化语言│├──mock//projectmock模拟数据│├──router//路由│├──store//全局存储管理│├──styles//全局样式│├──utils//全局公共方法│├──vendor//公共供应商│├──views//view│├──App.vue//入口页面│├──main.js//入口加载组件初始化等│├──settings.js//项目基础设置│├──permission.js//权限管理├──static//不打包第三方资源├──.babelrc//babel-loader配置├──eslintrc.js//eslint配置项├──.gitignore//git忽略项├──favicon.ico//favicon图标├──index.html//html模板└──package.json//package.json└──README.md//文档参考vue.jswebpack
