Vue+Element 后台管理系統 項目實戰（一）項目創建
本教程旨在記錄個人學習歷程，No thinking no coding!
項目創建：
主要命令：vue create vue-element-admin-demo
創建具體流程如下：
% vue --version @vue/cli 4.3.1 % vue create vue-element-admin-demo Vue CLI v4.3.1 ? Please pick a preset: Manually select features ? Check the features needed for your project: Babel, Router, Vuex, CSS Pre-proce ssors ? Use history mode for router? (Requires proper server setup for index fallback in production) Yes ? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): Sass/SCSS (with node-sass) ? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated confi g files ? Save this as a preset for future projects? No Vue CLI v4.3.1 ✨ Creating project in /Users/hrvy/Documents/vue-element-admin-demo. 🗃 Initializing git repository... ⚙️ Installing CLI plugins. This might take a while... yarn install v1.22.4 info No lockfile found. [1/4] 🔍 Resolving packages... [2/4] 🚚 Fetching packages... success Saved lockfile. ✨ Done in 27.59s. 🚀 Invoking generators... 📦 Installing additional dependencies... yarn install v1.22.4 [1/4] 🔍 Resolving packages... [2/4] 🚚 Fetching packages... [3/4] 🔗 Linking dependencies... [4/4] 🔨 Building fresh packages... success Saved lockfile. ✨ Done in 58.38s. ⚓ Running completion hooks... 📄 Generating README.md... 🎉 Successfully created project vue-element-admin-demo. 👉 Get started with the following commands: $ cd vue-element-admin-demo $ yarn serve
項目運行：
主要命令：yarn serve
具體項目啟動流程如下：
% cd vue-element-admin-demo % yarn serve yarn run v1.22.4 $ vue-cli-service serve INFO Starting development server... 98% after emitting CopyPlugin DONE Compiled successfully in 3102ms 23:25:54 App running at: - Local: http://localhost:8080/ - Network: http://192.168.0.101:8080/ Note that the development build is not optimized. To create a production build, run yarn build.
頁面效果：
項目結構：
