-
vue-cli创建步骤
查看全部 -
切换项目目录：cd /project/vue/
创建项目：vue create hello-world 或者vue create hello_world
查看全部 -
课程知识点
Vue2.x 框架常用知识点（模板语法、条件渲染、列表渲染等）
Vue2.x 核心技术（vue-router、vuex)
Vue2.x 集成入项目
课程重点
Vue2.x框架常用知识点 —— 20%
Vue2.x核心技术——30%
重点Vue2.x集成框架——30%
难点、模拟实际应用Vue2.x框架常用知识点（第二章）
认识vue：Hello Vue 应用
模块语法，v-bind属性绑定，事件绑定
条件渲染、列表渲染、Class与Style绑定
Vue2.x核心技术（第三章）
认识 vue-cli 工具，Vue 代码规范
Vue组件的调试方式
Vue-rounter，vuex
vue 的路由以及状态管理
集成Vue2.x（第四章）
简单介绍 workflow 开发工作流
介绍单页面、多页面的开发方式
单页面Demo（动态表单、列表动态展示）
使用Cli工具，开发常见的应用组件
例如登录模块、动态的列表渲染
开发环境
IDE（集成环境）
webstorm
可以集成更多的开发工具在里面（比如Git终端，而且有图形化界面，操作方便）
visuals Studio Code（VS code）
提供了一些智能化的插件，免费的、微软开发的编辑器，有语法高亮、语法提示，以及版本控制都可以集成在该编辑器里。
使用 webstorm 开发
工具常规配置
configure > Preferences
深色主题：Appearance > Theme > Darcula
应用 Apply
字体设置 Font > size
行间距 Font > Line spacing
Node.js 开发环境
nvm：Node Version Manager （Node的版本管理）
前端Node依赖库之间的兼容问题
GitHub nvm-sh
GitHub nvm-Windows
nvm 安装方法
Linux、macOS、Windows
Linux、macOS 可以使用 curl 命令安装、export 配置环境变量
Windows 安装方式
nvm-noinstall.zip： 这个是绿色免安装版本，但是使用之前需要配置
nvm-setup.zip：这是一个安装包，下载之后点击安装，无需配置就可以使用，方便。
Source code(zip)：zip压缩的源码
Sourc code(tar.gz)：tar.gz的源码，一般用于Linux和macOS
nvm命令
Windows下：
nvm arch [32|64]： 显示node是运行在32位还是64位模式。指定32或64来覆盖默认体系结构。
-nvm install <version> [arch]：该可以是node.js版本或最新稳定版本latest。（可选[arch]）指定安装32位或64位版本（默认为系统arch）。设置[arch]为all以安装32和64位版本。在命令后面添加–insecure，可以绕过远端下载服务器的SSL验证。
nvm list [available]：列出已经安装的node.js版本。可选的available，显示可下载版本的部分列表。这个命令可以简写为nvm ls [available]。
nvm on： 启用node.js版本管理。
nvm off： 禁用node.js版本管理(不卸载任何东西)
nvm proxy [url]： 设置用于下载的代理。留[url]空白，以查看当前的代理。设置[url]为none删除代理。
nvm node_mirror [url]：设置node镜像，默认为https://nodejs.org/dist/.。可以设置为淘宝的镜像https://npm.taobao.org/mirrors/node/
nvm npm_mirror [url]：设置npm镜像，默认为https://github.com/npm/npm/archive/。可以设置为淘宝的镜像https://npm.taobao.org/mirrors/npm/
nvm uninstall <version>： 卸载指定版本的nodejs。
nvm use [version] [arch]： 切换到使用指定的nodejs版本。可以指定32/64位[arch]。
-nvm use <arch>：将继续使用所选版本，但根据提供的值切换到32/64位模式
nvm root [path]： 设置 nvm 存储node.js不同版本的目录 ,如果未设置，将使用当前目录。
-nvm version： 显示当前运行的nvm版本，可以简写为nvm v
npm 安装
国内下载慢，可以使用 taobao 的镜像下载各版本 node
Linux、MacOS：
npm install -g cnpm --registry-https://registry.npm.taobao.org
windows：
使用命令行方式：
nvm node_mirror https://npm.taobao.org/mirrors/node/ nvm npm_mirror https://npm.taobao.org/mirrors/npm/
安装的目录下修改settings.txt文件，添加如下两行
node_mirror: https://npm.taobao.org/mirrors/node/ npm_mirror: https://npm.taobao.org/mirrors/npm/
安装 node.js
查看版本 nvm list available
安装node.js ，nvm install 版本号
使用 node.js , nvm use 版本号
同时安装相应版本的 npm
在 DOS 下使用 npm 命令时，需要进入相应版本的 node 文件夹中。因为没有配置该 node 版本的环境变量
调试环境
Chrome 的 Vue 插件
id输入如下：
nhdogjmejiglipccpnnnanhbledajbpd
遇到chrome无法拖拽 crx 时，将后缀改为 zip，直接拖拽即可。
工程环境 Vue-cli
在DOS中，进入 node 版本目录
执行如下命令，进行安装
npm i -g vue-cli
提示过期，改用如下命令
npm install -g @vue/cli-init
查看全部 -
课程重点
Vue2.x框架常用知识点 —— 20%
Vue2.x核心技术——30%
重点Vue2.x集成框架——30%
难点、模拟实际应用Vue2.x框架常用知识点（第二章）
认识vue：Hello Vue 应用
模块语法，v-bind属性绑定，事件绑定
条件渲染、列表渲染、Class与Style绑定
Vue2.x核心技术（第三章）
认识 vue-cli 工具，Vue 代码规范
Vue组件的调试方式
Vue-rounter，vuex
vue 的路由以及状态管理
集成Vue2.x（第四章）
简单介绍 workflow 开发工作流
介绍单页面、多页面的开发方式
单页面Demo（动态表单、列表动态展示）
使用Cli工具，开发常见的应用组件
例如登录模块、动态的列表渲染
查看全部 -
为什么学
小而美（灵活的语法、灵活的开发方式）
丰富的生态（模块、插件、开发团队、开发资料）
社区活跃、资料完整
广泛的应用（移动端、PC端）
vue 的流行程度
github 上的 vue 点赞排名
vue 排名第三 11万多赞
Facebook/react 排名第四
angular.js 已在第二面
可以看到全球程序员对vue的一个态度
学习方法
看
看目录
看出老师总结出来的知识框架
倍数看
讲的慢，可以使用倍数观看
重点看
可以挑选，观看重点部分
记
记笔记
记重点
记讨论
练习
随堂练
作业练
实战练
课程知识点
Vue2.x 框架常用知识点（模板语法、条件渲染、列表渲染等）
Vue2.x 核心技术（vue-router、vuex)
Vue2.x 集成入项目
查看全部 -
另外一个老师前几章讲的vue-cli：https://www.imooc.com/learn/1173
查看全部 -
computed如果包含实例外的变量，如果只修改实例外变量，computed不会计算；当修改了实例内变量时，computed会计算，并且此时实例外变量会被更新。
查看全部 -
watch：异步场景
computed：数据联动
查看全部 -
mac打开调试窗口
查看全部 -
实现同时渲染
查看全部 -
el对应有多个元素，会只渲染第一个元素。
查看全部 -
cdn地址：https://www.bootcdn.cn
查看全部 -
用npm下载淘宝镜像：npm install -g cnpm --registry-https://registry.npm.taobao.org
查看全部 -
谷歌插件下载：https://chrome-extension-downloader.com
查看全部 -
var app = new Vue({
watch:{
msg: function(newval,oldval){
}
},
computed:{
msg1: function(){
return: 'computed:' + this.msg
}
}
})
console:
app.msg='new value...'
查看全部
举报