Vue.js 踩坑记 (一)

这两年由于工作关系又转回去搞"没前途"的WinForm，虽说心里老大不情愿，作为一个大龄程序员，有时候不得不以生活为第一选择，太忙的工作也是无心坚持的，毕竟不能像年轻人那么拼精力，又出差又加班的工作确实不适合我，经过这么多年的打磨，我觉得这方面我也受够了。

虽然工作内容不容我去挑，但对技术的追求是一直不想放下的，过去几年的流行的前端框架一直在变，什么Dojo，Ext.js，BackBone，Angular.js 到如今的 Vue.js ，这其中只有Ext.js 认真的研究过一段时间，感觉很复杂，很商业化，功能确实强大，但封装的太厉害了，API一大堆，组件的使用都要学很久，要花很多的精力，关键是Ext.js 还只适合做后台管理系统，所以应用面并不是很宽。

经过观察，我发现Vue.js 这个框架很轻量级，容易上手，学过Asp.net MVC 的人也能明白Vue.js也有视图引擎，我觉得这个库还是值得一学，虽然我一直是偏重后端的开发，但是我仍然觉得学习Vue.js很有价值，闲话不扯了，下面看看怎么安装Vue.js吧，踩坑开始！

首先下载并安装node.js，然后去Github上把Vue Devtool 下载下来，或者安装个Git 输入命令把 Vue Devtool下载到本地，在此不细表了，在这个过程中也确实踩到几个小坑

本篇讲讲安装Vue Devtools遇到的坑，首先你需要在node.js上安装并编译这个东东。

1.首先 cd /d "Vue Devtool 的目录路径"，然后 npm install 进行安装，然后......什么!报错了!

npm ERR! code ENOLOCAL Could not install from "" as it does not contain a package.json file

不要慌张，我参考了下面的链接

http://blog.csdn.net/u014182411/article/details/78964344

2.然而我只做了一步就好了,更新NPM

npm install -g install

嗯，一切正常，没有报错了，接着 npm install，然后 npm run build ，最后 npm run dev (以后我们在研究这几个命令究竟是干嘛使的)，完整的命令如下

3.我参考了下面的链接

http://www.cnblogs.com/snowhite/p/7324446.html

修改shells>chrome文件夹下的mainifest.json 中的persistant为true

4.最后一步，终于可以安装 Vue的 Chrome 浏览器插件了，如图

5. 试试安装后的效果, Chrome 地址栏输入 http://localhost:8080/ 出现下图，嗯，安装成功了

Vue.js 踩坑记 (一)相关推荐

vue.js踩坑之单向数据流
vue.js父子组件之间的数据通信,细节总结隐性规则:单行数据流学前疑问: 1.父组件如何向子组件通信数据? 2.父组件可以直接修改子组件的数据!但是反过来绝对不可以!那怎么解决这个问题呢? 3. ...
vue.js踩坑之ref引用细节点
vue.js组件之H5页面,DOM标签或者组件中,通过ref="自定义name名称"引用的细节点要点简介:[ 见下文案例 ] 使用is=" "解决H5出现的标 ...
vue.js踩坑之组件参数检验与非props特性
vue组件参数检验与非props特性学前疑问: 什么是组件参数检验? 组件参数校验都有哪些属性设置?分别表示什么意思? 什么是props特性?何为非props特性?如何判断? 重要代码讲解如下: 父 ...
Django Vue 项目踩坑记：The field admin.LogEntry.user was declared with a lazy reference to ‘xxx‘
功能期望基于Django提供的AbstractUser类重写User模型,在其中根据业务需求增加信息,并将新的用户模型设为系统默认用户模型. 问题描述完成自定义User模型的编写,并在settin ...
Vue + TypeScript + Element 搭建简洁时尚的博客网站及踩坑记
前言本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 . TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript ...
Vue中video.js踩坑日记单页切换后视频无法播放
使用video.js踩坑.单页切换后视频无法播放切换页面以后正常显示效果但是我切换路由返回上一层或者点击跳转下个页面的返回的时候就不显示了?? 解决思路在生命周期beforeDestroy函数中 ...
android小程序_小程序踩坑记
小程序踩坑记希望这个文章能尽量记录下小程序的那些坑,避免开发者们浪费自己的生命来定位到底是自己代码导致的还是啥神秘的字节跳变原因. 前记小程序大多数坑是同一套代码在不同平台上表现不一致导致的,微信 ...
m3u8 video ios h5_移动端H5页面踩坑记
移动端H5页面踩坑记移动端的样式问题「1. 安卓 font-weight:700;以上才被认为是加粗.」「2. border 在 1px 以内是不被安卓识别的一些 0.5px 的下划线怎么搞?」 ...
在百度地图中叠加CAD图及GIS数据展示踩坑记
前言在之前的几篇博客中分别介绍了在Cesium中实现与CAD的DWG图叠加显示分析 https://www.cnblogs.com/vjmap/p/16541751.html . 高德地图与CAD ...
html2canvas图片的文字偏移,html2canvas在Vue项目踩坑-生成图片偏移不完整
背景最近做一个Vue项目需求是用户长按保存图片,页面的数据是根据不同id动态生成的,页面渲染完生成内容图片让用户长按保存的时候,把整个页面都保存起来. 在项目遇到的坑是图片能生成,可是生成的图片总是 ...

Vue.js 踩坑记 (一)

Vue.js 踩坑记 (一)相关推荐

最新文章

热门文章