vuejs的学习笔记

1、npm

npm：NPM 全称 Node Package Manager，它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具。通过NPM 可以安装、共享、分发代码,管理项目依赖关系。
-v：表示查看版本号。
npm init 命令初始化项目：新建一个 npm-demo 文件夹，通过命令提示符窗口进入到该文件夹，执行命令进行初始化项目，根据提示输入相关信息，如果使用默认值，则直接回车即可。package name: 包名，其实就是项目名称，注意不能有大写字母，version: 项目版本号，description: 项目描述，keywords: {Array}关键字，便于用户搜索到我们的项目。最后会生成 package.json 文件，这个是包的配置文件，相当于 maven 的 pom.xml 我们之后也可以根据需要进行修改。npm init -y：初始化项目，均使用默认信息。
版本号：3.3.2，分别为大版本，次要版本，小版本。~3.5.2，安装3.5.x的最新版本，不低于3.5.2，不安装3.6版本。^3.5.2，安装3.x.x的最新版本，但是不安装4.x.x。latest，安装最新版本。
用npm安装模块：npm install 命令用于安装某个模块，安装方式分为 ：本地安装（local）、全局安装（global）两种。本地：npm install <Module Name>[@版本号]，eg，npm install express 3.2.2；全局安装就是命令后面多加一个-g。
全局模块安装：查看全局目录：npm root -g。更改全局目录：npm config set prefix "D:\npm"。
生产环境模块安装：格式：安装时在后面加上--save 或 -S。意思是把模块的版本信息保存 package.json 文件的 dependencies 字段中（生产环境依赖)。
开发环境模块安装：格式：安装时在后面加上--save-dev 或 -D 参数是把模块版本信息保存到 package.json 文件的 devDependencies 字段中（开发环境依赖),所以开发阶段一般使用它。
批量下载模块：通过package.json，里面会保存需要下载哪些模块。在package.json所在目录启动cmd，直接输入npm install，就可以安装里面的模块。
查看模块命令：npm list可以查看当前目录下下载的模块，或者在下载目录直接查看，或者npm list 模块，可以直接查看某个模块版本号，或者npm view 模块 version，可以查看该模块的最新版本，把version改为versions，可以查看所有版本号。
卸载模块：npm uninstall <Module Name>，如果是卸载全局模块，加上-g。
配置淘宝镜像加速：可以让网站速度变快，在安装模块时会比较快。查看当前使用的镜像地址npm get registry。配置淘宝镜像地址npm config set registry https://registry.npm.taobao.org。还原默认镜像地址：npm config set registry https://registry.npmjs.org/。

2、vs code

插件安装：open in browser，使用 Alt + B 使用默认浏览器打开当前 html 页面，或 Shift + Alt + B 选择其他浏览器。Vue 插件：Vue 2 Snippets，支持高亮和快捷键；Vetur，语法高亮、智能感知、Emmet等；Auto Rename Tag，自动完成另一侧标签的同步修改；Path Intellisense，自动路径补全；HTML CSS Support，让 html 标签上写class 智能提示当前项目所支持的样式，安装后有快捷提示。
快捷键pdf文档：https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf。
git版本控制：下载配置cmd路径到环境变量，配置vscode里面的setting文件，"git.path": "D:/Git/bin/git.exe"。 
debug调试：https://code.visualstudio.com/Docs/editor/debugging官方文档。

3、vuejs

vue介绍：主流的渐进式 JavaScript 框架。渐进式：可以和传统的网站开发架构融合在一起，例如可以简单的把它当作一个类似 JQuery 库来使用。也可以使用Vue全家桶框架来开发大型的单页面应用程序 。优点：vue.js 体积小，编码简洁优雅，运行效率高，用户体验好. 无Dom操作，它能提高网站应用程序的开发效率。应用场景：一般是需要开发单页面应用程序 （Single Page Application, 简称:SPA） 的时候去用；单页面应用程序，如：网易云音乐 https://music.163.com/；因为 Vue 是 渐进式 的，Vue 其实可以融入到不同的项目中，即插即用。
学习资源：官网里面的文档https://cn.vuejs.org/。
发展历史：作者，尤雨溪。vuejs不支持ie8-浏览器，没办法模拟es5特性。

4、vuejs的使用

第一个vuejs：
<div id="app">
        <!-- { {}}用于标签体内显示数据 -->
        hello,{ { msg }}<br>
        <!-- v-model进行数据的双向绑定 -->
        <input type="text" v-model='msg'>
    </div>
    <script src="./node_modules/vue/dist/vue.js"></script>
    <script type="text/javascript">
        new Vue({
            el: '#app', //指定被vue管理的模块（利用选择器，但不能是body和html） 
            data: {
                msg: 'vuejs'
            }
        })
    </script>

MVVM模型：Model：模型， 数据对象（data选项当中 的）、View：视图，模板页面（用于渲染数据）、ViewModel：视图模型，其实本质上就是 Vue 实例。思想是通过数据驱动视图。