vue-cli3.0 搭建项目
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 搭建项目的更多相关文章
- 使用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 ...
- Vue Cli3 TypeScript 搭建工程
Vue Cli3出来也一段时间了,我想尝试下Vue结合TypeScript搭建个工程,感受下Vue下用TS...网上有一篇讲的非常详细的教程 vue-cli3.0 搭建项目模版教程(ts+vuex+ ...
- VUE CLI3.X 创建项目
Node.js环境搭建 Node.js基于V8引擎,可以让js代码脱离浏览器运行 Vue CLI3.0 需要Node.js 8.9或者更高版本. 用nvm或者nvm-windows在同一台电脑中管理多 ...
- vue cli3.0 结合echarts3.0和地图的使用方法
echarts 提供了直观,交互丰富,可高度个性化定制的数据可视化图表.而vue更合适操纵数据. 最近一直忙着搬家,就没有更新博客,今天抽出空来写一篇关于vue和echarts的博客.下面是结合地图的 ...
- vue cli3.0打包
1.vue cli3.0需要在项目根目录下配置webpack 包括反向代理以及打包文件路径 const webpack = require("webpack"); module. ...
- 解决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 ...
- 01-路由跳转 安装less this.$router.replace(path) 解决vue/cli3.0语法报错问题
2==解决vue2.0里面控制台包的一些语法错误. https://www.jianshu.com/p/5e0a1541418b 在build==>webpack.base.conf.j下注释掉 ...
- vue 3.0 vue-cli项目搭建要点
一.使用vue-cli搭建项目(可使用vue ui图形化界面搭建项目,配置dist时,将名称设为项目名称) 二.项目搭建后 1.配置vue.config.js // 翻阅文档https://cli.v ...
- 【原创】Asp.NET Core Web API与Vue 3.0搭建前后分离项目
特地记录一下,网上的教程写的稀里糊涂的,整得我都心塞塞的,其实实现的过程蛮简单的 问题是这样的:我将Vue构建生成好的文件,放在后端wwwroot文件里面,并开启静态文件访问功能,结果总是无法显示相应 ...
- 前端学习日记-vue cli3.0环境搭建
卸载老版本的 vue-cli : npm uninstall vue-cli -g 安装新版本的 : npm install -g @vue/cli --安装新版本cli 同时nodeJS 要更新至 ...
随机推荐
- 2015年北京大学软件project学科优秀大学生夏令营上机考试---C:单词翻转面试题
题目描写叙述:翻转句子中单词的顺序.但单词内字符的顺序不变.句子中单词以空格符隔开. 为简单起见,标点符号和普通字母一样处理.如:"I am a student."翻转成" ...
- 【cl】测试用例【文本框-电子邮箱】
电子邮箱控件用例: 1.只输入字母,如:abc 2.只输入数字,如:123 3.空白.空格或回车等 4.特殊的字符,如:¥,$等 5.上述四种的组合 6.不正确的邮箱组合: ①.abc@sohucom ...
- java 命令行 编译 运行程序
学习java使用IDE前最好先用用命令行的javac.java来跑一跑简单的程序,这样能够熟悉一下包管理对.class文件路径的影响. 我们先写一段简单的代码: package com.csdn.lk ...
- day63-webservice 10.jquery的调用webservice小练习
客户端是采用jquery方式来做调用.但是这种调用,因为jquery这种调用你就得有消息体.我们得先拿到这种消息体.PersonService这个服务类有两个方法. http://localhost: ...
- 部署hexo后github pages页面未更新或无法打开问题
title: 部署hexo后github pages页面未更新或无法打开问题 date: 2018-03-30 15:34:29 categories: methods tags: hexo gith ...
- NVL和NVL2有什么区别,NULLIF 的使用.
NULL指的是空值,或者非法值. NVL (expr1, expr2):expr1为NULL,返回expr2:不为NULL,返回expr1.注意两者的类型要一致 NVL2 (expr1, expr2, ...
- 关于Html基础语法学习
晚上做完初赛,好像有点颓,就来学了学html,毕竟博客里面会用到嘛. 首先贴出我所学习的教程 http://www.w3school.com.cn/html/index.asp 我觉得吧,可能以我的记 ...
- hiho一下 第173周
题目1 : A Game 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 Little Hi and Little Ho are playing a game. Ther ...
- 洛谷P4413 [COCI2006-2007#2] R2(可持久化平衡树维护NTT)
题意翻译 设S=(R1+R2)/2,给定R1与S (-1000<=R1,S<=1000)(−1000<=R1,S<=1000) ,求R2. 感谢@Xeonacid 提供的翻译 ...
- win10下mysql安装过程中遇到的各种坑
前几天重装系统,又要下回来mysql,但没想到还是遇到了许多麻烦,翻了十多篇博文才搞定,写个总结出来方便以后不要重复踩坑,也给大家参考参考. 1.下载与安装 这个没什么好说的,下载地址网上一大堆,安装 ...