2017.4.7开始辞职刚好一个月时间,一个月时间里我开始彷徨,迷惘,失业带来的痛苦,打算转行,不再搞机械行业,因为不想再做低端的产品设计(本身不是研究生也不是说天资卓越,只是不甘于平凡)。

好了,不说这些,开始总结一下,vue是一个前端的框架,先从官网https://cn.vuejs.org/仔细阅读了一遍,把基本的语法和应用的例子,在大脑建立一个数据模型

首先接触这个vue框架,先要获取它的源码,所以就引入了一个包管理工具node.js,在官网下载之后采用阿里云的一个镜像命令cnpm来代替npm

这里我遇到了一个坑,在这里我弄了一个晚上才理解是怎么回事:

首先安装完node之后,

简单介绍gulp在使用过程中常用命令,打开命令提示符执行下列命令(打开方式:window + r 输入cmd回车):

node -v查看安装的nodejs版本,出现版本号,说明刚刚已正确安装nodejs。PS:未能出现版本号,请尝试注销电脑重试;

npm -v查看npm的版本号,npm是在安装nodejs时一同安装的nodejs包管理器,那它有什么用呢?稍后解释;

cd定位到目录,用法:cd + 路径 ;

dir列出文件列表;

cls清空命令提示符窗口内容。

首先安装完node之后,会自带一个npm命令控制器,npm -v

表示安装成功,接下来设置npm要下载的代码和缓存的存放位置

代码安装位置设置:npm config set prefix D:\nodejs\node_global

缓存的存放位置:D:\nodejs\node_cache

再安装cnpm,npm install cnpm -g --registry=https://registry.npm.taobao.org

在系统环境变量设置一个path变量名,变量:D:\nodejs\node_global

重启npm命令控制器

cnpm -v

这样显示算是成功了,接下来安装vue的脚手架工具vue-cli

cnpm install -g vue-cli

利用webstrom来开发第一个基于vue框架的webpack工具

 创建一个基于 webpack 模板的新项目
vue init webpack my-project
cd my-project
npm install
npm run dev
一路回车。。。之后会创建一个端口,我的是localhost:8080
 
在浏览器上输入localhost:8080,就可以得到一个vue的首页
 
 
 

vue.js个人学习心得的更多相关文章

  1. vue.js 初步学习

    跟着b站上的视频来学 首先什么是vue.js? 跟着b站上视频来学:(o゚v゚)ノ <!DOCTYPE html> <html lang="en"> < ...

  2. Vue.JS入门学习随笔

    PS:先说说学习Vue的缘由吧,学习完了React之后,突然发现又出了一款叫做vue的框架,而且据说可以引领又一波新框架的潮流,我容易吗我!!!   Vue.js(读音 /vjuː/, 类似于view ...

  3. 从零开始学习Vue.js,学习笔记

    一.为什么学习vue.js methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节. vue.js兼具angular.js和react的优点,并且剔除了他们的缺点 官网:http://cn ...

  4. vue.js的学习中的简单案例

    今天学习了近年来挺火的一门JS技术,叫vue.js下面是它的一个简单案例: <html> <head> <title>$Title$</title> / ...

  5. vue.js的学习

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. vue.js路由学习笔记

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. web前端——Vue.js基础学习

    近期项目的前端页面准备引入Vue.js,看了网上一些简介,及它和JQuery的对比,发现对于新入门的前端开发来说,Vue 其实也是比较适用的一个框架,其实用性不比JQuery差,感觉还挺有意思,于是研 ...

  8. 两万字Vue.js基础学习笔记

    Vue.js学习笔记 目录 Vue.js学习笔记 ES6语法 1.不一样的变量声明:const和let 2.模板字符串 3.箭头函数(Arrow Functions) 4. 函数的参数默认值 5.Sp ...

  9. 两万字Vue.js基础学习笔记(二)

    Vue.js学习笔记(二) 4.模块化开发 ES6模块化的导入和导出 我们使用export指令导出了模块对外提供的接口,下面我们就可以通过import命令来加载对应的这个模块了 首先,我们需要在HTM ...

随机推荐

  1. 【RF库Collections测试】Log Dictionary 【同log list】

    Name:Log DictionarySource:Collections <test library>Arguments:[ dictionary | level=INFO ]Logs ...

  2. Python调用7zip命令实现文件批量解压

    Python调用7zip命令实现文件批量解压 1.输入压缩文件所在的路径 2.可以在代码中修改解压到的文件路径和所需要解压的类型,列入,解压文件夹下面所有的mp4格式的文件 3.cmd 指的就是Pyt ...

  3. python中的数据类型与json的数据类型之间的转化

    什么是json: JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.易于人阅读和编写.同时也易于机器解析和生成.它基于JavaScript Programm ...

  4. MyBatis批量更新for Mysql 实例

    <update id="UpdatePwd" parameterType="java.util.List"> UPDATE FP_USER_BASE ...

  5. Struts2(三)配置详解

    一.概述 Struts2提供了多种可选的配置文件形式. 其中,struts-default.xml和default.properties是框架级别的配置文件,这两个文件在Struts的核心JAR包中, ...

  6. thinkphp 控制器unset删除对象变量失败。。

    今儿开发过程中发现 tp是unset 变量失败..具体代码 foreach( $this->menu as $k => $v){ if(0 == $v['flag']) unset($th ...

  7. Linux设备驱动剖析之SPI(三)

    572至574行,分配内存,注意对象的类型是struct spidev_data,看下它在drivers/spi/spidev.c中的定义: struct spidev_data { dev_t de ...

  8. Delphi2010中DataSnap技术

    文章来源: https://blog.csdn.net/xieyunc/article/details/47865227?_t_t_t=0.3049736963513836 一.为DataSnap系统 ...

  9. eagle学习汇总

    一.原理图编辑器 1. 编辑->全局属性->可以设置全局变量,选择“文本框”,以‘>’开头代表引用全局属性的值. 2. 绘制->Frame->可绘制原理图边框,一般选择“ ...

  10. UINavigationItem 设置UIBarButtonItem

    转:http://hi.baidu.com/ivan_xu/item/237bb1ad77eff9b028ce9d7c 有A.B两个ViewController,假如A push B: UINavig ...