cncml手绘网
标题: Vue.js 安装 [打印本页]
作者: admin 时间: 2018-7-1 23:05
标题: Vue.js 安装
Vue.js 安装1、独立版本我们可以在 Vue.js 的官网上直接下载 vue.min.js 并用 <script> 标签引入。
% N5 K2 P. n8 m6 Q( u" g- <scriptsrc="http://www.w1.hk/jss/vue.js"></script>
复制代码 2、使用 CDN 方法以下推荐国外比较稳定的两个 CDN,国内还没发现哪一家比较好,目前还是建议下载到本地。
. b d! p& A# t% V6 C
3、NPM 方法由于 npm 安装速度慢,本教程使用了淘宝的镜像及其命令 cnpm,安装使用介绍参照:使用淘宝 NPM 镜像。 npm 版本需要大于 3.0,如果低于此版本需要升级它:
- # 查看版本+ |+ J1 q" a! A0 [; F: `
- $ npm -v
9 {( C) K* Q2 F( X - 2.3.0
9 V/ \. r6 x* N
7 @. {( V5 s3 }" c- X1 q3 k- #升级 npm
0 z4 l2 W6 Y+ Z$ p - cnpm install npm -g
复制代码在用 Vue.js 构建大型应用时推荐使用 NPM 安装:
- # 最新稳定版9 A: N+ N$ x- _( {( ^( V
- $ cnpm install vue
复制代码 命令行工具Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。
- # 全局安装 vue-cli* m" j8 O4 j+ P& x/ X8 \3 ~
- $ cnpm install --global vue-cli
' K) c! F4 A9 X - # 创建一个基于 webpack 模板的新项目
y* G% m/ `) @7 l$ {5 W" w - $ vue init webpack my-project/ s; F6 T, t, f; j1 w4 s1 J8 O
- # 这里需要进行一些配置,默认回车即可
9 R7 k7 e0 F, C" m - This will install Vue 2.x version of the template.
. B0 I) f. @( z1 N - 0 N) P- I6 L3 |3 ~9 o5 m i& Y/ l
- For Vue 1.x use: vue init webpack#1.0 my-project( w' T1 N7 i b: J4 \7 Y
- 5 q6 a: @# J# p: e, ?8 `4 r
- ? Project name my-project- T" Q) ]7 R" |
- ? Project description A Vue.js project/ k1 s1 A: \8 K4 i9 }
- ? Author runoob <test@runoob.com>
) s) h4 M) E+ X E# a - ? Vue build standalone
8 W8 G: b1 N" ^: x- b - ? Use ESLint to lint your code? Yes! V6 I; I1 @8 e* J6 |% P
- ? Pick an ESLint preset Standard
! [, T9 |' ~# g, G/ e, z$ d' f+ b6 t - ? Setup unit tests with Karma + Mocha? Yes+ @" U6 \7 c0 {
- ? Setup e2e tests with Nightwatch? Yes( q* h2 o/ P$ P6 Y. U
0 l, j" D% [& _! _- vue-cli · Generated "my-project".7 a0 u j; m+ }9 `" C$ E
- ( ?/ [, y& f: r* X# w
- To get started:& |2 E; Y, a0 p% c5 r7 M
- " r8 ?* {, n n' e0 I
- cd my-project) C5 U# w+ @0 m# J/ w
- npm install/ x0 K9 t% l: X1 P. O. N
- npm run dev1 w5 I4 o: w& q
- 3 A, ~ ?- q0 W% g6 ]8 Q2 p
- Documentation can be found at https://vuejs-templates.github.io/webpack
复制代码进入项目,安装并运行:
- $ cd my-project: [7 b H3 t3 Z; s6 `
- $ cnpm install g5 g+ V2 `2 H8 Z! Z
- $ cnpm run dev* g; H: X+ ]) L; I6 e+ i% w
- DONE Compiled successfully in 4388ms
; H X9 o; k' I( S! x# T- q
: f* Y. ?7 E8 I' t$ l# z; w' @- > Listening at http://localhost:8080
复制代码成功执行以上命令后访问 http://localhost:8080/,输出结果如下所示:
% l! b: q9 h* n, p- L" ^# s9 [" c
" a4 E& L8 F+ _3 w* Z
9 [' A$ j6 Q! t4 g, ?2 ^( @5 W% P
& b7 ^+ [* l# p; H% `, G9 `
| 欢迎光临 cncml手绘网 (http://www.cncml.com/) |
Powered by Discuz! X3.2 |