一、安装vue-cli 脚手架命令

npm install -g vue-cli   适用于vue-cli 2.0

npm install -g @vue/cli 适用于vue-cli 3.0

卸载命令:npm uninstall -g @vue/cli

二、初次安装 vue-cli 3.0 步骤:

1、全局安装vue-cli 3.0 脚手架

npm install -g @vue/cli

2、创建项目文件夹(文件夹名必须写)

vue create demo1

3、

按键盘方向键 向下键 选择: 自定义配置,回车

4、

选择用哪些配置,按上下键 选择哪一个,按空格键确定,所有的都选择好后,按enter键进行下一步,这里我选择的:Babel、TypeScript、Router、Vuex、CSS Pre-processors

*这里稍微说一下 Progressive Web App (PWA) Support,据了解,这是一种新型的前端技术,目前在印度最流行,具体可以看一下这篇文章:https://blog.csdn.net/qq_19238139/article/details/77531191

5、

都按 y 吧

6、

选择一种css预处理语言

7、

上面这个是问你选择哪个自动化代码格式化检测,配合vscode编辑器的 Prettier - Code formatter插件,我选最后一个

8、

是否保存配置,我选择保存

9、

上边这俩意思问你像,babel,postcss,eslint这些配置文件放哪?

第一个是:放独立文件放置

第二个是:放package.json里 这里推荐放单独配置文件,

选第一个

10、

上边倒数第二行问你是否将以上这些将此保存为未来项目的预配置吗?

最后一个是项目描述,你随意写,回车确定就开始下载模板了

11、下载完成后,目录结构如下:

相比2.0 精简了很多,启动服务: npm run serve

vue-cli 3.0 安装的更多相关文章

  1. VUE CLI 3.0 安装及创建项目

    一.安装 VUE CLI 3.0 官网: https://cli.vuejs.org/   详细资料可以自己先把官网过一遍. 1. 安装(默认你的电脑上已安装node及npm) npm install ...

  2. 如何使用@vue/cli 3.0在npm上创建,发布和使用你自己的Vue.js组件库

    译者按: 你可能npm人家的包过成千上万次,但你是否有创建,发布和使用过自己的npm包? 原文: How to create, publish and use your own VueJS Compo ...

  3. vue/cli 3.0脚手架搭建

    在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli  安装成功:  安装完成 ...

  4. @vue/cli 4.0+express 前后端分离实践

    之前总结过一篇vue-cli 2.x+express+json-server实现前后端分离的帖子,@vue/cli3.0及4.0搭建的项目与vue-cli2.x的项目结构有很大的不同.这里对@vue/ ...

  5. @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件

    目录 @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件 运行 使用 配置 svg-sprite-loader 调用当前环境下的颜色 props @vue/cl ...

  6. Vue CLI 3.0脚手架如何在本地配置mock数据

    前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...

  7. Django + Vue cli 3.0 访问静态资源问题

    [问题背景] 用Vue clie 3.0的搭建得框架把我坑死了,在打包后,调用不到静态资源js,css,mp3等 [问题原因] vue cli 3.0打包后,dist目录下没有static目录,而Dj ...

  8. 专访Vue作者尤雨溪:Vue CLI 3.0重构的原因

    1.为什么要对 Vue CLI 进行大规模修改? 尤雨溪认为旧版本的 Vue CLI 本质上只是从 GitHub 拉取模版,这种拉模版的方式有几个问题: (1) 在单个模版里面同时支持太多选项会导致模 ...

  9. vue cli 4.0.5 的使用

    vue cli 4.0.5 的使用 现在的 vue 脚手架已经升级到4.0的版本了,前两日vue 刚发布了3.0版本,我看了一下cli 4 和cli 3 没什么区别,既然这样,就只总结一下vue cl ...

  10. 【Vue CLI】从安装到构建项目再到目录结构的说明

    目录 1. 构建我们的项目 2. 目录结构说明 2.1 build目录 2.2 config目录 2.3 src目录 2.4 static目录 "Vue CLI是一个基于Vue.js进行快速 ...

随机推荐

  1. 下载根目录下的pdf文件, 浏览器下载

    public void outPut(HttpServletRequest request, HttpServletResponse response, Integer type) { ClassPa ...

  2. 【软工实践】Alpha冲刺(6/6)

    链接部分 队名:女生都队 组长博客: 博客链接 作业博客:博客链接 小组内容 恩泽(组长) 过去两天完成了哪些任务 描述 tomcat的学习与实现 服务器后端部署,API接口的beta版实现 后端代码 ...

  3. Cache busting

    Cache busting https://www.keycdn.com/support/what-is-cache-busting https://curtistimson.co.uk/post/f ...

  4. C# default(T)关键字

    C#关键词default函数,default(T)可以得到该类型的默认值. C#在类初始化时,会给未显示赋值的字段.属性赋上默认值,但是值变量却不会. 值变量可以使用默认构造函数赋值,或者使用defa ...

  5. win10磁盘分区

    注意:未分配的磁盘是无法使用的. 安装系统的时候,我们可以先将系统装起来,再来对未分配的磁盘进行操作. 具体步骤:https://jingyan.baidu.com/article/fcb5aff76 ...

  6. python限定方法参数类型、返回值类型、变量类型等

    typing模块的作用 自python3.5开始,PEP484为python引入了类型注解(type hints) 类型检查,防止运行时出现参数和返回值类型.变量类型不符合. 作为开发文档附加说明,方 ...

  7. [LeetCode] 377. Combination Sum IV 组合之和 IV

    Given an integer array with all positive numbers and no duplicates, find the number of possible comb ...

  8. python爬虫1

    1 网页结构 html:超文本标记语言------->类似人的鼻子耳朵,长在那里,大体骨架就是那个样子 css:层叠样式表------->这个是外观的深化,比如贴个双眼皮,橙色眼睛... ...

  9. linux_shell程序快速入门

    1.shell的基本类型: 表达式类型:使用关键字expr申明. 声明格式 :var=`expr $a - $b` 相关运算符号:+,-,*,/,%. 坑点:一定要注意空格,某些地方空格省略会造成语法 ...

  10. maven设置阿里云仓库

    到maven安装目录的conf下setting.xml文件 找到mirrors标签中添加 <mirror> <id>nexus-aliyun</id> <mi ...