背景
最近Easyui释放出了vue版本,尝试一波。
vue cli3
cli的全称是command-line interface,即命令行界面,简而意之vue cli就是vue的命令行界面版本。这里假设你已经安装好了npm(全称 Node Package Manager),npm是nodejs的包管理器。vue的cli需要依赖npm来安装。
npm install -g @vue/cli
安装成功后,验证一下vue:
vue --version
创建vue工程
vue create hello-world
设置vue工程
Vue CLI v3.0.3
? Please pick a preset:
default (babel, eslint)
❯ Manually select features
这里选择手动选择功能,即Manually select features
;
Vue CLI v3.0.3
? Please pick a preset: Manually select features
? Check the features needed for your project:
◉ Babel
◯ TypeScript
◉ Progressive Web App (PWA) Support
◉ Router
◉ Vuex
❯◉ CSS Pre-processors
◉ Linter / Formatter
◯ Unit Testing
◯ E2E Testing
这里选择了
- Babel:JavaScript的编译器。
- PWA:渐进式网络应用程序(英语:Progressive Web Apps,简称:PWA)是一种普通网页或网站架构起来的网络应用程序,但它可以以传统应用程序或原生移动应用程序形式展示给用户。这种应用程序形态视图将目前最为现代化的浏览器提供的功能与移动设备的体验优势相结合。
- Vue Router:Vue Router 是 Vue.js 官方的路由管理器。
- Vuex:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。
- CSS Pre-processors:css 预处理器。
- Linter / Formatter:用来标记源代码中有疑义段落的工具和格式化工具。
Vue CLI v3.0.3
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, PWA, Router, Vuex, CSS Pre-
processors, Linter
? Use history mode for router? (Requires proper server setup for index fallback
in production) (Y/n) Y
HTML5 History 模式选择默认的Yes
。
Vue CLI v3.0.3
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, PWA, Router, Vuex, CSS Pre-
processors, Linter
? Use history mode for router? (Requires proper server setup for index fallback
in production) Yes
? Pick a CSS pr