vue cli3没记错的话是在2019年8月份yyx个人正式声明发布。

接下来就开始我们的vue cli3的方式创建vue项目。明白一点,vue cli3遵循的一个原则就是 "0配置" 也就是说开发者不需要自己手动去做一些复杂配置。这里还提供了一个vue cli可视化工具,通过这一工具可以更加方便的去管理和创建我们的vue项目!

通过 vue  create projectname 命令去创建vue项目,vue cli2是通过 vue init webpack projectname 去创建项目。

根据自定义项目名称按下回车:

这里看到有个666-arch的项目(第一次创建的时候是没有的!),实际上这个项目是根据下面一个配置它会让你选择是否记住本次配置的项目手段,然后以后再去创建项目的时候不需要再一一选择,直接按照你第一次创建的这个项目来配置。而这个配置具体文件是在一个 .vuerc 的文件里面配置的。实际上就相当于配置的一个项目模板。第二次创建的时候选择这个模板就行了。

路径的位置要看你们自己的。

如果想要删除掉这个配置就是再这个文件里面去操作。把presets里面配置相关的删除掉然后保存这个文件就行了。

Manuall select features 这个的意思就是全场手动去配置,这里我就还是选择手动配置

相比vue cli2这里就一次性选择你需要的配置然后再创建。这里只选择Babel去配置

配置完成之后的项目结构(主要看main,js这个入口的变化):

往服务器做提交时做一些配置,有些文件时不需要提交的服务器的时候,就需要改动这个 .gitignore 文件就行了,比如/dist,这个文件就会被忽略:

服务启动命令也是在package.json文件中时可以查看的,这一点和vue cli2时一样的。只不过少了很多内容,目的就是为了"0配置",我们不需要做太多的考虑去研究这个命令执行后还去执行了哪些哪些文件。。。

我们去执行的时候好是通过 npm run serve 这个和vue cli2还是不愿意,vue cli2是通过 npm run dev

接下来就是要去看到一个可视化工具。通过 vue ui 就可以运行起来,这也是启动服务的一种方式。实际上可视化工具在我们通过命令:npm install -g @vue/cli 的时候已经帮我们创建好了。

这里的重点是导入的操作,也就是将我们通过命令创建好的vue项目导入到这里GUI管理器中,这样以后子啊管理这个项目的时候会更加的方便和清晰。

导入之后:

点击插件:

这些已有的插件就是我们通过命令行去配置的时候根据需要安装的插件。

.net工程师学习vue的心路历程(三)的更多相关文章

  1. .net工程师学习vue的心路历程(一)

    实习一年后,想做一个属于自己的博客网站,准备用core api去搭建服务端接口,前端准备采用vue这样的一个框架.本身时一个服务端程序员,所以来学习记录一些vue的知识点,有什么不足的希望大家指正,谢 ...

  2. .net工程师学习vue的心路历程(二)

    本章主要搞懂在通过vue init webpack projectname 命令创建 vue 项目过程中有个选择.即关于如何选择:runtime+compiler和runtime+only. 现在我通 ...

  3. 学习JS的心路历程-函式(一)

    前几天有间单提到该如何声明函式及在Hositing中会发生什么事,但是函式的奥妙不仅于此. 身为一个使用JS的工程师,我们一定要熟悉函式到比恋人还熟! 这几天将会把函式逐一扒开跟各位一起探讨其中的奥妙 ...

  4. 学习JS的心路历程-参数传递方式(上)

    很多人认为JS的传递方式是值是Call by value, 物件及数组是Call by Reference.甚至还有人宣称其实JS是Call by sharing,那到底是哪一个呢? 这两天我们一一来 ...

  5. 学习JS的心路历程-声明

    变量 在程序中将一个值指定(assign)给一个符号式的容器(symbolic container),叫做一个变量(variable). 声明在JS中目前提供了三种声明方式: var 声明一个变量,可 ...

  6. 学习JS的心路历程-类型

    前言 之前学JS时候都是靠着谷狗一路跌跌撞撞的学过来,从来没有去翻过MDN的文件,导致留了许多技术债给自己. 最近有幸遇到一位前辈并开始从头学JS,前辈表示学程序不看文件是想作死自己?于是我的第一份功 ...

  7. 学习JS的心路历程-参数的传递(下)

    今天我们要来探讨JS到底是透过何种参数传递方式呢? 废话不多说,上示例!! 我们先声明原始型别和物件型别来看看两者是否会有不一样的差异: var myStr = 'Hola': var myObj = ...

  8. 学习JS的心路历程-范围Scope和提升(Hoisting)

    在上一篇提到了JS有三种声明变量的方式,分别是var.const及let,var和const let最大区别就是范围(scope)的限制.所以在这一篇我们会详谈何谓范围链及他们的复写优先级. 范围Sc ...

  9. 手牵手,从零学习Vue源码 系列一(前言-目录篇)

    系列文章: 手牵手,从零学习Vue源码 系列一(前言-目录篇) 手牵手,从零学习Vue源码 系列二(变化侦测篇) 手牵手,从零学习Vue源码 系列三(虚拟DOM篇) 陆续更新中... 预计八月中旬更新 ...

随机推荐

  1. Spring源码之创建AOP代理之增强器的获取

    前言 在上一篇博文中我们说到了通过自定义配置完成了对AnnotationAwareAspectJAutoProxyCreator类型的自动注册,那么这个类究竟做了什么工作从而完成AOP的操作呢?首先我 ...

  2. == 和 equals区别

    == equals是两种字符串的方式 区别 == 是比较两个对象的引用地址值 equals是比较两个对象的具体内容 示例 package com.oop.demo06; public class De ...

  3. 一文读懂 Serverless,将配置化思想复用到平台系统中

    作者 | 春哥大魔王 来源 | Serverless 公众号 写在前面 在 SaaS 领域 Salesforce 是佼佼者,其 CRM 的概念已经扩展到了 Marketing.Sales.Servic ...

  4. SAE助力南瓜电影7天内全面Severless

    作者:李刚(寻如),阿里云解决方案架构师 南瓜电影APP是国内领先的专注于影视精品化运营的垂直类视频产品,在移动互联网.IPTV.OTT等客户端,面向广大中产阶级精英群体,提供有异于院线及其他视频平台 ...

  5. Hibernate的介绍及入门小案例

    1.Hibernate的诞生 在以前使用传统的JDBC开发应用系统时,如果是小型应用系统,并不觉得有什么麻烦,但是对于大型应用系统的开发,使用JDBC就会显得力不从心,例如对几十,几百张包含几十个字段 ...

  6. 题解 「SDOI2017」硬币游戏

    题目传送门 Description 周末同学们非常无聊,有人提议,咱们扔硬币玩吧,谁扔的硬币正面次数多谁胜利. 大家纷纷觉得这个游戏非常符合同学们的特色,但只是扔硬币实在是太单调了. 同学们觉得要加强 ...

  7. Miller-Rabin学习笔记

    首先给出两个定理: 1.费马小定理 设p是一个素数,a是一个整数,且不是p的倍数,那么 \(a^{p−1} \equiv\ 1 \pmod p\) 2.二次探测定理 若\(p\)是素数,\(x\)是一 ...

  8. 创建线程的4种方法 and 线程的生命周期

    线程的启动和运行 方法一:使用start()方法:用来启动一个线程,当调用start方法后,JVM会开启一个新线程执行用户定义的线程代码逻辑. 方法二:使用run()方法:作为线程代码逻辑的入口方法. ...

  9. Linux服务器装Anaconda&TensorFlow

    远程Linux服务器装Anaconda&指定版本TensorFlow 说明: 由于疫情影响,原先使用的服务器已断电,故重选了一台服务器对环境重选进行搭建,正好补上这篇博文. 01 下载Anac ...

  10. [对对子队]会议记录4.17(Scrum Meeting8)

    今天已完成的工作 何瑞 ​ 工作内容:修复了一些bug,优化了UI ​ 相关issue:搭建关卡1 ​ 相关签入:4.17签入1 吴昭邦 ​ 工作内容:做了一些流水线系统的错误处理,添加了合成失败了之 ...