|
Vue.js 安装1、独立版本 我们可以在 Vue.js 的官网上直接下载 vue.min.js 并用 <script> 标签引入。
) @! X6 i9 z7 W# J* N- <scriptsrc="http://www.w1.hk/jss/vue.js"></script>
复制代码 2、使用 CDN 方法以下推荐国外比较稳定的两个 CDN,国内还没发现哪一家比较好,目前还是建议下载到本地。 - 8 @7 d* j" k2 r% O; x# @( p ^
, m }9 p; u# W1 g
3、NPM 方法由于 npm 安装速度慢,本教程使用了淘宝的镜像及其命令 cnpm,安装使用介绍参照:使用淘宝 NPM 镜像。 npm 版本需要大于 3.0,如果低于此版本需要升级它: - # 查看版本" `" r5 J6 t) u: Z5 _
- $ npm -v
( f0 G6 [, R$ l7 g' K- l, D - 2.3.0
3 T- v( T6 n; W/ |" C: I9 q. w - b5 D5 R: S0 ~ [
- #升级 npm
. x6 j% U4 U( k4 q; R" Q9 h - cnpm install npm -g
复制代码在用 Vue.js 构建大型应用时推荐使用 NPM 安装: - # 最新稳定版$ V$ a/ `- s% i* ~( i$ b
- $ cnpm install vue
复制代码 命令行工具Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。 - # 全局安装 vue-cli; a$ }3 J9 ?3 d. i
- $ cnpm install --global vue-cli
6 C9 ? Z7 s' G2 E4 U" P - # 创建一个基于 webpack 模板的新项目
' u6 q3 G8 }/ e7 Q4 `9 { - $ vue init webpack my-project
3 X3 D7 n: Y. [2 ] - # 这里需要进行一些配置,默认回车即可$ j& i( }8 V' z3 k0 Y+ X- y+ I
- This will install Vue 2.x version of the template.+ M9 J+ N/ X. n( w. B( A
) v, S4 i3 R* }# N( E# z- For Vue 1.x use: vue init webpack#1.0 my-project" S4 ~" a/ H+ t3 C4 {3 f
- % {- N- M/ p$ f" x: [" i: M( I
- ? Project name my-project
+ k& E) ?# j3 A( ` - ? Project description A Vue.js project4 L) x @& K3 \0 T
- ? Author runoob <test@runoob.com>
! [* b" A5 o1 L! z! i/ I - ? Vue build standalone
3 ?( r H: g- w% `. x - ? Use ESLint to lint your code? Yes4 C4 w i, E% D1 Y6 q1 z8 r
- ? Pick an ESLint preset Standard2 R+ u- K; t' V+ R8 C
- ? Setup unit tests with Karma + Mocha? Yes7 Y! f. t/ Q- N4 `, ~: b B7 m
- ? Setup e2e tests with Nightwatch? Yes
& |- S, H( Z* s* a
2 t. E+ j8 L" q! X7 v! g, e+ i- vue-cli · Generated "my-project".
( N- G0 V& x) q6 c- W. c
0 y( }" M+ [# w( i- To get started:7 V8 i2 g7 Q# i/ C" J
- : h. w v9 J% Q! U3 ~5 C7 @& ~
- cd my-project
& }/ [+ f. R! k( u/ ^ - npm install
' |2 i3 d2 b3 N3 M, T8 f8 ~- Z - npm run dev5 q8 k+ a( [1 D/ L4 V* V
- , _+ D5 H2 Z3 q6 d! v
- Documentation can be found at https://vuejs-templates.github.io/webpack
复制代码进入项目,安装并运行: - $ cd my-project3 Y0 ] i1 \, o# z* A8 r! o* v6 ?
- $ cnpm install
/ v6 n! Y3 L6 d, T7 U, E1 J - $ cnpm run dev
1 T6 z8 m6 B% b' e2 i% R - DONE Compiled successfully in 4388ms
4 n$ V% j( W4 m$ n/ F J9 c - 5 U/ O! W0 b1 u3 v
- > Listening at http://localhost:8080
复制代码成功执行以上命令后访问 http://localhost:8080/,输出结果如下所示: 2 Q. @; {! r" y! P5 \" x% F9 L
( D/ E' W. j# M$ Q& C! w+ a# o" \/ a( h7 M: T4 O
& H% W; n l: b$ e# U% c) ~
* W s! K" F5 _* V! P$ | |