本教程旨在记录个人学习历程,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.
页面效果:
项目结构:
原文:https://www.cnblogs.com/hrvyzou/p/12741542.html