前端Vue准备工作
环境准备:
1、安装Node&npm,只是为了要Node.js的环境https://nodejs.org/en/download/
2、安装完成Node以及npm之后,就可以用npm config list 查看npm基本配置信息了

3、将npm镜像替换成淘宝镜像 npm config set metrics-registry https://registry.npm.taobao.org
4、某些情况下安装node-sass时候特别慢,需要添加一个npm的镜像包 npm config set SASS_BINARY_SITE http://npm.taobao.org/mirrors/node-sass
5、某些情况下安装chromedriver时候特别慢,需要添加一个npm的镜像包 npm config set chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver
6、安装yarn yarn install
7、npm install -g vue-cli 安装vuecli (用于使用vue init webpack my-project 命令创建模版项目)
8、npm-check-updates 更新npm包工具
9、npm uninstall npm -g 卸载npm
npm使用
npm init 初始化项目添加package.json文件 package.json存放了npm的基本信息,包括,依赖包(开发与生产环境依赖包),项目执行的命令等(进入项目目录,确定已有package.json,没有就npm init 创建 Note:可能会遇到Sorry, name can no longer contain capital letters.意思是项目名称不能包含大写字母)
npm i (npm install 缩写)安装package.json文件中配置的开发环境依赖包
npm i [name] [g] --save-dev 安装第三方依赖包
name 包名
g 全局安装
--save 将保存配置信息至package.json
-dev 保存至package.json的devDependencies节点,不指定-dev将保存至dependencies节点
npm uninstall <name> [-g] [--save-dev] 卸载依赖包
npm update [--save-dev] 更新全部插件
npm list 查看当前目录已安装插件
从vue下载一个模板之后,使用npm run dev,放问本地8080端口,就可以看到以下页面,就证明环境正确:


VSCode 插件
Auto Close Tag 自动补全html标签
Auto Rename Tag 同步更改html尾标签
ESLint ESlint语法提示
HTML CSS Support css语法提示
Path Autocomplete 文件自动路径提示
vetur
Vue浏览器调试工具
Vue.js devtools
相关知识点
vue:https://cn.vuejs.org/v2/guide/
vuex:https://vuex.vuejs.org/zh-cn/
vue-rooter:http://router.vuejs.org/zh-cn/
ES 6:http://es6.ruanyifeng.com/?search=%E7%AE%AD%E5%A4%B4&x=0&y=0
webpack:https://doc.webpack-china.org/
前端Vue准备工作的更多相关文章
- Web前端-Vue.js必备框架(五)
Web前端-Vue.js必备框架(五) 页面组件,商品列表组件,详情组件,购物车清单组件,结算页组件,订单详情组件,订单列表组件. vue-router 路由 vuex 组件集中管理 webpack ...
- Web前端-Vue.js必备框架(四)
Web前端-Vue.js必备框架(四) 计算属性: <div id="aaa"> {{ message.split('').reverse().join('') }} ...
- Web前端-Vue.js必备框架(三)
Web前端-Vue.js必备框架(三) vue是一款渐进式javascript框架,由evan you开发.vue成为前端开发的必备之一. vue的好处轻量级,渐进式框架,响应式更新机制. 开发环境, ...
- Web前端-Vue.js必备框架(二)
Web前端-Vue.js必备框架(二) vue调式工具vue-devtools 过滤器:vue.js允许你自定义过滤器,可被用作一些常见的文本格式化. mustache插值和v-bind表达式. vu ...
- Web前端-Vue.js必备框架(一)
Web前端-Vue.js必备框架(一) <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- web前端Vue+Django rest framework 框架 生鲜电商项目实战视频教程 ☝☝☝
web前端Vue+Django rest framework 框架 生鲜电商项目实战视频教程 web前端Vue+Django rest framework 框架 生鲜电商项目实战视频教程 学习 ...
- 前端Vue知识小白
感觉是已好久没写博文了.今日难得有时间,便写一篇文章.此文章是关于前端知识的,我本身是后端,因工作或其他需要,便学习了前端Vue.此文章是在菜鸟教程上学习的.那么下面进入正文! 首先,Vue.js是一 ...
- 前端Vue中常用rules校验规则
前提 在 vue开发中,难免遇到各种表单校验,这里整理了网络上和自己平时高频率用到的一些校验方法.如果错误欢迎指出,后期不断补充更新. 1.是否合法IP地址 export function valid ...
- 前端vue实现pdf文件的在线预览
3.前端vue实现pdf文件的在线预览 我是通过 <iframe> 标签就可以满足我工作的 pdf预览需求 如果<iframe> 无法满足需求 , 可以使用pdf.js这个插件 ...
随机推荐
- 用js写九九乘法表格,附带背景颜色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- MIT-6.824 操作系统 汇总
MIT-6.828-JOS-环境搭建 ELF文件格式 lab1:C, Assembly, Tools, and Bootstrapping lab2:Memory management lab3:Us ...
- Python面向对象-类、实例的绑定属性、绑定方法和__slots__
绑定属性 从之前的文章中,我们知道python是动态语言——实例可以绑定任意属性. 那如果实例绑定的属性和类的属性名一样的话,会是什么情况呢? >>> class Student(o ...
- 开源Odoo13更新的模块功能信息(译文)
本文来源江苏欧度软件:www.odooyun.com 本次Odoo13已于10月初发布,更新的模块有:Odoo会计模块.Odoo活动项目模块.Odoo13审批模块.Odoo评价.客户关系管理(CRM) ...
- 如何编写一个工程文件夹下通用的Makefile
新建工程文件夹,在里面新建 bsp.imx6ul.obj 和project 这 3 个文件夹,完成以后如图所示: 新建的工程根目录文件夹 其中 bsp 用来存放驱动文件:imx6ul 用来存放跟芯片有 ...
- Eclipse——关联源代码
Eclipse——关联源代码 摘要:本文主要说明了如何在Eclipse里关联源代码. 下载源码包 首先去想要关联的jar包的官网下载对应jar包的源代码,拿Tomcat的类库举例,先去官网下载源码包: ...
- Vultr主机绑定域名
1.在腾讯云上注册域名 然后,域名实名认证 2.Vultr主机购买(看我之前写的:手把手教你如何自己搭梯子) 然后会获取到一个服务器IP地址 3.绑定域名与IP 点解,解析后会弹出让你输入IP地址,此 ...
- cocos2d游戏jsc文件格式解密,SpideMonkey大冒险
“ 介绍cocos2d游戏中常用的jsc格式文件的解密.” 01 — 在破解游戏应用中,经常会碰到后缀为jsc的文件,这是基于cocos2d开发的游戏的加密代码,本质上是js文件,只是被加密了. 例如 ...
- Vue之富文本tinymce爬坑录
前言 最近因业务需求在项目中嵌入了tinymce这个富文本编辑器,用于满足平台给用户编辑各类新闻内容什么的业务需求,前后也花了不少时间体验和对比了市面上各类开源编辑器. *案例demo版本:vue-t ...
- 12c分区增强功能,新功能(文档ID 1568010.1)
12c Partitioning Enhancements, New Features (Doc ID 1568010.1) APPLIES TO: Oracle Database - Enterpr ...