vue2.x入门学习
Posted perfei
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue2.x入门学习相关的知识，希望对你有一定的参考价值。
vue安装
# 最新稳定版本
$ npm install vue
# 最新稳定 CSP 兼容版本
$ npm install vue@csp
引包
cd /d/vue/demo
cnpm install vue@csp
$ ll node_modules/vue/dist/
total 1509
-rw-r--r-- 1 tanpengfei3 1049089 279 4月 27 2016 README.md
-rw-r--r-- 1 tanpengfei3 1049089 403335 9月 28 2016 vue.common.js
-rw-r--r-- 1 tanpengfei3 1049089 402783 9月 28 2016 vue.js
-rw-r--r-- 1 tanpengfei3 1049089 131766 9月 28 2016 vue.min.js
-rw-r--r-- 1 tanpengfei3 1049089 594279 9月 28 2016 vue.min.js.map
vue.min.js 压缩删减版
vue.js 完整版本
mkdir a01_v_newvue
mkdir -p static/js
cp ../node_modules/vue/dist/vue.js static/js/
index.html
<!DOCTYPE html> <html> <head> <title>引包，el，模板，data, 插值</title> </head> <body> <div id="app"></div> <script type="text/javascript" src="static/js/vue.js"></script> <script type="text/javascript"> new Vue({ el:"#app", template:` <div>模板显示：{{msg}}</div> `, data:function(){ return { msg: ‘数据‘ } } }); </script> </body> </html>
页面显示
模板显示：数据
注意事项：vue 与 Vue 是不同的
以上是关于vue2.x入门学习的主要内容，如果未能解决你的问题，请参考以下文章