cncml手绘网
标题: Vue.js 安装 [打印本页]
作者: admin 时间: 2018-7-1 23:05
标题: Vue.js 安装
Vue.js 安装1、独立版本我们可以在 Vue.js 的官网上直接下载 vue.min.js 并用 <script> 标签引入。
# l. z' v+ L- i% W4 u- <scriptsrc="http://www.w1.hk/jss/vue.js"></script>
复制代码 2、使用 CDN 方法以下推荐国外比较稳定的两个 CDN,国内还没发现哪一家比较好,目前还是建议下载到本地。
+ ?0 C ~/ ]$ t. g0 ?0 h v3、NPM 方法由于 npm 安装速度慢,本教程使用了淘宝的镜像及其命令 cnpm,安装使用介绍参照:使用淘宝 NPM 镜像。 npm 版本需要大于 3.0,如果低于此版本需要升级它:
- # 查看版本8 i1 l, a$ N* I6 x, q5 f
- $ npm -v
5 ~/ e7 I$ j* a; ~6 o' ^ - 2.3.0' }: `1 A; m: e+ Z! p+ e, p
% N4 Q& }) c" p9 M& R. A7 y- #升级 npm
5 ~* @' {0 P0 @ - cnpm install npm -g
复制代码在用 Vue.js 构建大型应用时推荐使用 NPM 安装:
- # 最新稳定版7 F& K/ E4 V$ B0 e ?3 O' Z
- $ cnpm install vue
复制代码 命令行工具Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。
- # 全局安装 vue-cli6 s# b: }. E, d
- $ cnpm install --global vue-cli9 C0 [/ i7 k, I- ^9 f1 w9 z/ q
- # 创建一个基于 webpack 模板的新项目/ ^+ }4 D* `( B& D& J
- $ vue init webpack my-project
9 ?' U/ [% X& {; A$ y - # 这里需要进行一些配置,默认回车即可6 Q; v o5 E2 E4 Z4 f$ e
- This will install Vue 2.x version of the template.. p, G- i" f @: Y1 S
5 F: n- G7 p# ]( O- For Vue 1.x use: vue init webpack#1.0 my-project
! Y4 m7 g7 K8 ^: P+ i M$ N. t
' m+ m. `" I+ f: ~! K+ n: g" t& u5 e8 S- ? Project name my-project
/ X# c$ p& x- \ - ? Project description A Vue.js project
. i8 n) g; u, U" W% E9 Z - ? Author runoob <test@runoob.com>
m9 _$ Q! g- P' H6 v( ?+ P5 A - ? Vue build standalone2 v+ r0 Z+ o+ [% d* j; r! Y4 d
- ? Use ESLint to lint your code? Yes
' f! k3 V- W3 s! |! k - ? Pick an ESLint preset Standard" f6 D1 F8 i2 v e) D
- ? Setup unit tests with Karma + Mocha? Yes
. M6 s. e. x6 W) V8 c1 O5 n0 g - ? Setup e2e tests with Nightwatch? Yes
9 Y" Q6 }; h$ [$ d. O9 I: ^; U - 1 K' M- c/ n) O, R X2 Z* F* W
- vue-cli · Generated "my-project".5 l# k6 a! P" y; h* z. U- \
- 8 S8 T3 e: y5 w& a* P4 Y# R
- To get started:3 F7 e% j4 u2 M* V
- ' A; C. V N6 p& N. w# q, {
- cd my-project. \/ M# L9 L; u9 l, c8 }) J+ `
- npm install
3 A6 t* b* L5 U! d4 ~4 i5 Q7 q - npm run dev
1 e' h3 q/ ]1 e/ W8 h) o -
4 O' `% h8 `; ^3 }, `0 f L - Documentation can be found at https://vuejs-templates.github.io/webpack
复制代码进入项目,安装并运行:
- $ cd my-project
0 G1 }, S7 o) }5 p6 q# {8 b- j - $ cnpm install
% N. ?0 M- _) N6 P - $ cnpm run dev/ x3 Z2 `# r4 ~) a) F
- DONE Compiled successfully in 4388ms
5 J4 A) F4 J& ^3 u1 s - * H/ {$ K3 p3 {4 E+ W
- > Listening at http://localhost:8080
复制代码成功执行以上命令后访问 http://localhost:8080/,输出结果如下所示:
/ ~( ^/ I$ m3 O) d
7 C/ ^" W+ t0 N, n7 z( G9 Q/ _4 R
) T/ n) ]. ~& C
0 w9 e8 i9 B- N( Q* C& m
a6 Z S/ f( [" I1 I# a
| 欢迎光临 cncml手绘网 (http://www.cncml.com/) |
Powered by Discuz! X3.2 |