1、首先我们先在安装好node   node用于npm安装【自行百度】

2、全局安装vue

  通过npm命令安装vue.js

  在用vue.js在用于构建大型的应用时推荐使用npm安装,npm能很好的和webpack、browserify、commonJS模块 打包器 配合使用

  npm i -g vue

3、全局安装vue-cli

  npm i -g @vue/cli

  安装完成后输入 vue -V  或者 vue --version  检查vue-cli 的版本

4、创建一个vue项目

  vue create hello-world  hello-world为文件名

5、这里我们选择Manually (手动地)

6、随后出现  【空格是选择,回车确认】

Babel:这个是解析我们es6的代码的,为什么要用它呢?因为对于一些ie浏览器,甚至firFox浏览器低版本的还不能识别我们的es6代码,在写项目中我们还是有很多地方要用到它滴。

    那么我们就可以用babel这个小家伙将我们的es6的代码转译成浏览器能识别的代码

TypeScript:使用typescript的语法

Progressive Web App (PWA) Support:支持渐进式的网页应用程序

Router:Vue Router  

Vuex:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。【文档原话搬过来的】 router 和 vuex 文档有很大的帮助

CSS Pre-processors:选择CSS预处理

Linter / Formatter:规范你,反正就是让你撸着撸着就不爽的东西。

Unit Testing:单元测试  【具体百度一下吧,嘻嘻】

E2E Testing:端到端的测试  【同上】

在这个项目中我们就选择这几样,回车    然后根据提示走

一个简单的vue项目就搭建好了

我们cd 进maizuo这个文件夹

npm run serve 打开初始vue页面

打开浏览器输入http://localhost:8080/

vue-cli3.0 搭建项目的更多相关文章

  1. 使用VUE CLI3.0搭建项目vue2+scss+element简易版

    1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...

  2. Vue Cli3 TypeScript 搭建工程

    Vue Cli3出来也一段时间了,我想尝试下Vue结合TypeScript搭建个工程,感受下Vue下用TS...网上有一篇讲的非常详细的教程  vue-cli3.0 搭建项目模版教程(ts+vuex+ ...

  3. VUE CLI3.X 创建项目

    Node.js环境搭建 Node.js基于V8引擎,可以让js代码脱离浏览器运行 Vue CLI3.0 需要Node.js 8.9或者更高版本. 用nvm或者nvm-windows在同一台电脑中管理多 ...

  4. vue cli3.0 结合echarts3.0和地图的使用方法

    echarts 提供了直观,交互丰富,可高度个性化定制的数据可视化图表.而vue更合适操纵数据. 最近一直忙着搬家,就没有更新博客,今天抽出空来写一篇关于vue和echarts的博客.下面是结合地图的 ...

  5. vue cli3.0打包

    1.vue cli3.0需要在项目根目录下配置webpack  包括反向代理以及打包文件路径 const webpack = require("webpack"); module. ...

  6. 解决vue/cli3.0 语法验证规则 ESLint: Expected indentation of 2 spaces but found 4. (indent)

    当你使用vue/cli3.0的时,有可能出现雁阵规则 ESLint: Expected indentation of 2 spaces but found 4. (indent) 解决方法 1.在vu ...

  7. 01-路由跳转 安装less this.$router.replace(path) 解决vue/cli3.0语法报错问题

    2==解决vue2.0里面控制台包的一些语法错误. https://www.jianshu.com/p/5e0a1541418b 在build==>webpack.base.conf.j下注释掉 ...

  8. vue 3.0 vue-cli项目搭建要点

    一.使用vue-cli搭建项目(可使用vue ui图形化界面搭建项目,配置dist时,将名称设为项目名称) 二.项目搭建后 1.配置vue.config.js // 翻阅文档https://cli.v ...

  9. 【原创】Asp.NET Core Web API与Vue 3.0搭建前后分离项目

    特地记录一下,网上的教程写的稀里糊涂的,整得我都心塞塞的,其实实现的过程蛮简单的 问题是这样的:我将Vue构建生成好的文件,放在后端wwwroot文件里面,并开启静态文件访问功能,结果总是无法显示相应 ...

  10. 前端学习日记-vue cli3.0环境搭建

    卸载老版本的 vue-cli : npm uninstall vue-cli -g 安装新版本的 : npm install -g @vue/cli --安装新版本cli 同时nodeJS 要更新至 ...

随机推荐

  1. HTTP基本认证(Basic Authentication)的JAVA演示样例

    大家在登录站点的时候.大部分时候是通过一个表单提交登录信息.可是有时候浏览器会弹出一个登录验证的对话框.例如以下图,这就是使用HTTP基本认证.以下来看看一看这个认证的工作过程:第一步:  clien ...

  2. RubyMine快捷键

    RubyMine快捷键 ctrl+shift+up/down 向上/向下移动代码段 alt+shift+up/down 向上/向下移动代码行 ctrl+y 删除一行 ctrl+shift+f10 运行 ...

  3. 关于Java特种兵下冊

    <Java特种兵 下冊>这本书一直没出.至上冊出版近1年以来,每周会有非常多小伙伴发私信或邮件问起我下冊出版的事情,纵使眼下有非常多无奈,小胖还是初步决定准备写下冊. 下冊内容(下冊的内容 ...

  4. UVa 11466 - Largest Prime Divisor

    題目:給你一個整數n(不超過14位).求出他的最大的素數因子.假设仅仅有一個素數因子輸出-1. 分析:數論. 直接打表計算10^7內的全部素數因子,然後用短除法除n.記錄最大的因子就可以. 假设最後下 ...

  5. PHP之实现双向链表(代码篇)

    <?php/** * PHP之实现双向链表 */class Hero{ public $pre=null; public $no; public $name; public $next=null ...

  6. [CSharp] C#开源大全

    商业协作和项目管理平台-TeamLab 网络视频会议软件-VMukti 驰骋工作流程引擎-ccflow [免费]正则表达式测试工具-Regex-Tester Windows-Phone-7-SDK E ...

  7. 下载jdk12版本没有jre问题处理

    以往下载jdk1.6版本直接运行会生成jdk,jre两个文件,但今天下载jdk12运行后,只有jdk目录文件,并没有jre后来在网上查找后通过命令行方式手动生成jre 1.下载jdk12 网址:htt ...

  8. 用Webpack构建Vue项目

    开始之前,需要安装node环境.(安装过程在此就不啰嗦了)   1.创建基本结构 首先我们要创建一个空文件夹(我这里叫todos,你可以随便命名)作为项目的根目录. 创建一个没有任何依赖关系的pack ...

  9. .net 对称加密

    后台   public class CryptoHelper     {         // 对称加密算法提供器         private ICryptoTransform encryptor ...

  10. 文档控件NTKO OFFICE 详细使用说明之预览word编辑保存回服务器

    1.在线预览Word文件 (1) 运行环境 ① 浏览器:支持IE7-IE11(平台版本还支持Chrome和Firefox) ② IE工具栏-Internet 选项:将www.ntko.com加入到浏览 ...