1.1 npm安装教程
1、使用之前,我们先来掌握3个东西是用来干什么的
1. npm: Nodejs下的包管理器。
2. webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资源的合并和打包。
3. vue-cli: 用户生成Vue工程模板。(帮你快速开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库,只需要 npm install就可以安装)
2、下载安装
1. 下载node.js: https://nodejs.org/en/ (选择左边,不要选最新的)
2. 安装完成node.js后就会生成npm工具,安装完成后即可下载其他工具
3. 利用npm安装vue.js: npm install bower -g
4. 安装完成后会将文件下载到:D:\nodejs\node_global\node_modules 目录下
5. 我们使用vue.js时只需到 D:\nodejs\node_global\node_modules 文件夹下,复制 vue.js 只需在使用时引用即可
3、引入vue.js,基本使用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <!-- 向容器中渲染新闻--> <div id="app">{{ msg }}</div> <script type="text/javascript" src="vue.js"></script> <script type="text/javascript"> // 定义数据模型 var data = { msg:"vue.js基本使用!!!" // 使用的数据 }; // 定义视图模型 var app = new Vue({ // 绑定视图 el:'#app', // 绑定模型 data:data }); </script> </body> </html>