vue-cli 3.0 使用全过程讲解

2018年8月13日更新: 恭祝vue-cli 3.0.0 官方正式版发布,此后我们可以正式在3.0环境下进行项目开发了。

此文发布以来受到了很多朋友的阅读,但我深知这篇文章还是很浅显的,因此,我会在后续的 3.0 使用过程中分享我遇到的各种问题以及解决方案(如果能解决的话。。。)。


首先在使用

vue create my-project
创建项目的时候要选择使用 css 预处理器。

安装 vue-cli

首先使用 npm 安装 vue-cli v3.0。

npm install -g @vue/cli

安装完成后使用

vue -V
查看版本号,如果显示版本号说明安装完成。

创建项目

vue-cli v3.0 创建项目的命令与 2.0 有所不同。3.0 创建项目的命令为:

vue create test-project
  • 创建过程中首先选择创建的模式,是采用默认配置,还是自定义配置:

通过上下箭头进行选择。window 默认 cmd 可能不支持箭头上下选择,建议下载其他 shell 工具。

建议采用 Mannual select features 自定义模式。这样可以自主选择需要的插件。

因为我之前创建过一次,所以创建了一个命名为 walle 的模板,下次创建的时候可以直接按照上次的模板进行创建。

选择自定义模式后可以自由选择想要在项目中使用的插件,用空格键选中。

  • 如果选择了 CSS Pre-processors (CSS预处理器), 则接下来会让你选择预处理器的类型。

我选择了相对比较熟悉的 SCSS/SASS 预处理器。这样就可以在项目中使用 SCSS 语法和 SASS 语法了。关于如何在项目中使用 SCSS/SASS 请看我的另一篇博客。

  • 接下来会让你选择 lint 的模式,也就是检测代码的规则。

  • 选择每次保存时进行代码规则校验。

  • 选择配置文件的集成方式,是配置在独立文件中,还是全都配置在 package.json 文件中。因为在独立文件中比较容易看,所以建议选择使用独立文件。

  • 最后就是询问你是否将此次的配置生成一个模板,下次直接之后模板配置直接生成项目了。

  • 确定后就开始了漫长的项目生成之旅了。(第一次使用 vue-cli 进行项目生成可能会卡主,一直不动,这时候按一下 enter 键项目就能继续生成了)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/367094.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

java反射机制在spring_Java反射机制在Spring IOC中的应用

IOC:即“控制反转”,不是什么技术,而是一种思想。使用IOC意味着将你设计好的对象交给容器控制,而不是传统的在你的对象内部直接控制。本篇文章主要讲解一下IOC底层实现的原理(反射),Bean容器的实现,就不对I…

【图像处理】Haar-like特征

特征提取的原理、代码等; 如果是白黑白,是减去一个黑的还是2个黑的,网上有不同的说法;应该需要看原论文了。 论文原文 The sum of the pixels which lie within the white rectangles are subtracted from the sum of pixels in t…

mysql获取某个表的所有字段名

转载:mym43210 mysql安装成功后可以看到已经存在mysql、information_schema和test这个几个数据库。 information_schema库中有一个名为COLUMNS的表,这个表中记录了数据库中所有表的字段信息。 知道这个表后,获取任意表的字段就只需要一条sele…

neo4j / cypher:悬挂查询参数

一直以来,我一直在使用neo4j的密码查询语言, 迈克尔一直在告诉我在查询中使用参数,但是查询的性能始终可以接受,因此我没有必要。 但是,最近我正在研究一个数据集,并使用类似于以下的代码创建了约500个节点…

java调用浏览器组件来_Java 网页浏览器组件介绍

在使用 Java 开发客户端程序时,有时会需要在界面中使用网页浏览器组件,用来显示一段 HTML 或者一个特定的网址。本文将介绍在界面中使用浏览器组件的四种方法,给出示例的代码,并且分析每种方法的优点与不足,便于 Java …

前端入行两年--教会了我这些道理

1.前言 光阴似箭,日月如梭。不得不感慨时间过得很快,2017差不多结束了,一下子我从事前端开发的时间已经两年了。这两年可以说是一波三折,回想这两年的经历,让我忍不住了写下了这篇文章,记录自己在这两年经历…

解决Nginx: [error] open() Nginx.pid

使用nginx -c的参数指定nginx.conf文件的位置 sudo /usr/sbin/nginx -c /etc/nginx/nginx.conf 转载于:https://www.cnblogs.com/vannn/p/9756132.html

巴霍巴利王

巴霍巴利王 惊心动魄的宫廷政变,必然铸就新的王朝更迭。时代的婉转,终究选上得民心的君主。我们的故事就这样悄无声息的将你带入幽深的宫廷内院。 夜幕之中,面对寒冷与杀戮,一位身负重伤王室女人,抱着一个新生儿&#…

Java中的观察者设计模式-示例教程

观察者模式是行为设计模式之一 。 当您对对象的状态感兴趣并希望在发生任何更改时得到通知时,观察者设计模式很有用。 在观察者模式中,监视另一个对象状态的对象称为Observer ,而正在监视的对象称为Subject 。 根据GoF,观察者模式…

华为大数求和 java_大数乘积java

{"data":{"id":"8000-000000437045-0","name":"SEO专题页栏目分发组","type":"1","position":"8000-000000004003-0","status":1,"linkList":[{"id"…

IdnentiyServer-使用客户端凭据访问API

情景如下:一个客户端要访问一个api,不需要用户登录,但是又不想直接暴露api给外部使用,这时可以使用identityserver添加访问权限。 客户端通过clientid和secrect访问identitserver的Token Endpoint,获取accesstoken; 接…

重要·Flutter 首个预览版 发布

今天,InfoQ China 主办的 GMTC 全球大前端技术大会在北京举行,在这次大会中 Google 宣布发布 Flutter 首个预览版。这无疑让 Flutter 迈上了一个新的台阶。于此同时推出了 Flutter 社区中文资源 。可能有些同学还不了解 Flutter,这里再普及一…

复习做UWP时涉及到的几种加密签名相关

复习做UWP时涉及到的几种加密签名相关 原文:复习做UWP时涉及到的几种加密签名相关本人菜鸟一枚,大学里凭兴趣学了一点WP的皮毛,后来又幸运(或者不幸)的进了一家专注于Windows生态的公司做了一段时间的UWP。在博客园写点自己遇到的…

Java中的中介器设计模式-示例教程

中介者模式是行为设计模式之一 ,因此它处理对象的行为。 中介器设计模式用于在系统中不同对象之间提供集中式通信介质。 根据GoF,中介者模式意图是: 通过封装不同对象集相互交互和通信的方式,允许松散耦合。 允许每个对象集的动作…

java gc full gc_Java中full gc什么意思?

慕雪6442864除直接调用System.gc外,触发Full GC执行的情况有如下四种。1. 旧生代空间不足旧生代空间只有在新生代对象转入及创建为大对象、大数组时才会出现不足的现象,当执行Full GC后空间仍然不足,则抛出如下错误:java.lang.Out…

springboot-RequestMappingHandlerMapping

作用&#xff1a;查看应用请求对应的ur和方法l情况 实例&#xff1a; RequestMappingHandlerMapping mapping applicationContext.getBean("requestMappingHandlerMapping",RequestMappingHandlerMapping.class);Map<RequestMappingInfo, HandlerMethod> map …

JavaScript中Ajax的用法

XMLHttpRequest 对象的属性和方法&#xff1a; open(method,url,async)  规定请求的类型、URL 以及是否异步处理请求  send(string)        将请求发送到服务器。  responseText       获得字符串形式的响应数据。  responseXML        获得 XM…

axios请求超时,设置重新请求的完美解决方法

自从使用Vue2之后&#xff0c;就使用官方推荐的axios的插件来调用API&#xff0c;在使用过程中&#xff0c;如果服务器或者网络不稳定掉包了, 你们该如何处理呢? 下面我给你们分享一下我的经历。 具体原因 最近公司在做一个项目, 服务端数据接口用的是Php输出的API, 有时候在…

从代码内部:骆驼路由引擎第一部分

因此&#xff0c;最近我重新燃起了对Apache Camel工作原理的兴趣。 Camel是一种功能强大的集成工具&#xff0c;用途非常广泛&#xff0c;但是只要我投入使用&#xff0c;我都会忍不住想&#xff1a;“嗯&#xff0c;这到底是怎么做到的&#xff01;” …猜想我只是有一个诀窍&…

java比较时间sql_如何正确比较日期 java.sql.Date

import java.sql.Date;...............例如今天是2010-12-2Date d1 new Date(System.currentTimeMili());Date d2 new Date(System.currentTimeMili()1);//比d1晚1毫秒日期上&#xff0c;我们认为d1和d2是相等的但是System.out.println(d1.before(d2));输出结果是true;其实我…