vue cli 4 多环境_手把手教你Vue入门01快速创建

    近期自学Vue，进行了POC，趁还有记忆，把一些经历和踩过的坑都记录一下，适合入门级的小白，大佬请忽略。

    项目主要技术架构

    • Vue全家桶

      • Vue         - 核心模块

      • Vue-Route   - 路由

      • Axios        - 网络通信

      • Vuex        - 全局状态

    • vue/cli         - 脚手架

    • Element        - UI库

    • Webpack       - 模块打包器

    • Babel          - 语法转换器

    • easyMock      - 模拟数据生成器

    • GitLab Cl       - 版本控制

    1.基本概念

    1.1 什么是Vue?

    1.1.1 渐进式框架

    Vue.js(读音 /vjuː/，类似于 view) 是一套构建用户界面的渐进式JavaScript 框架。

    • Vue 只关注视图层， 采用自底向上增量开发的设计。

    • Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

    • 本项目基于 Vue 2.6.10 开发。目前，2.x的最新稳定版是2.6.11，3.0版本即将发布。

    1.1.2 Vue的由来

    Vue.js的作者是尤雨溪，他曾在 Google 和 Meteor 工作过，后来通过 Patreon 平台众筹全职开发 Vue 的资金。

    尤雨溪在 Google 的工作时需要在浏览器上进行大量原型设计，当时有些项目使用了 Angular。Angular 提供了一些用数据绑定和数据驱动来处理 DOM 的方法，它也有一些副作用，就需要按照它规定的方式来构建代码，对于当时的场景而言实在是太重了。

    尤雨溪想把自己喜欢的部分从 Angular 中提出来，建立一个非常轻巧的库，如声明式数据绑定，Vue 就是这么开始的。

    2013 年，他花了更多的时间把它封装好，取了一个名字叫做 Vue.js。 

    2014 年 2 月，他第一次将它作为实际的项目发布在 Github 上，并把链接发送到了 Hacker News 上，它就被顶到了首页，在Github获得很多认可。

    之后，他在 Patreon 上挂出众筹页面，希望获得经济支持可以让 Vue 持续稳定维护下去，当时他说如果在 Patreon 每个月众筹到 4000 美元他就全职开发 Vue，事实上每月可以众筹到 9800 美元，于是就有了Vue的后续更新。

    1.2 Vue单文件组件

    使用Vue，可以像引入JavaScript文件一样，在 Vue.js 的官网上直接下载 vue.js 并用