vue中点击加号_零基础入门vue开发

上面一节我们已经成功的安装了nodejs，并且配置了npm的全局环境变量，那么这一节我们就来正式的安装vue-cli，然后在webstorm开发者工具里运行我们的vue项目。

这一节有两种创建vue项目的方式

1，通过npm命令行创建
2，通过webstorm来一键创建项目

准备工作

1，我们在创建项目之前，需要确保nodejs已经成功安装，如果你还没有安装没有配置npm全局环境变量，可以参考《nodeJs的安装与npm全局环境变量的配置》
2，由于国内用npm安装三方依赖时，速度比较慢，建议大家配置国内镜像，配置方式如下。只需要在cmd命令行窗口执行下面操作即可

npm config set registry https://registry.npm.taobao.org

一，使用命令行的方式创建vue项目

1，桌面创建一个空文件夹，如vue0117

进入这个文件夹，然后在顶部地址栏，输入cmd，然后回车键即可快速的打开dos命令行，并且定位到当前目录。

2，然后执行下面命令行，安装vue-cli。

npm install -g vue-cli

等待安装

安装完成如下，这里显示vue-cli的版本号，即代表安装完成

3，使用webpack模板创建一个vue项目

vue init webpack my-project

如项目名为vue001

在出现下面几个询问项时，直接按照箭头所示的操作即可

下载项目所需类库

项目创建完成后，如下

5，执行 npm install 下载所需类库下载中

下载完成

6，使用webstorm打开项目，点击file，然后点击open

导入刚才创建的vue项目

7，运行项目

项目运行成功后，在浏览器里打开下面链接

到这里就代表项目成功的创建并运行了。

二，使用webstorm一键创建vue项目

1，点击file，然后new，然后点击project

2，构建项目

3，等待项目创建和类库加载

耗时可能比较长，耐心等待。。。。

3，上面构建成功后，可以运行并浏览项目了

到这里，两种创建vue项目的方式都讲完了，后面我会录制专门的视频来讲解。敬请期待。

vue中点击加号_零基础入门vue开发相关推荐

数据结构和算法_零基础入门01
数据结构和算法_零基础入门01 一.数据结构是什么? 逻辑结构.物理结构二.算法算法的五个基本特征算法设计的要求 b站学习小甲鱼的数据结构与算法,自留笔记. 程序设计=数据结构+算法一.数据结 ...
一期完结《一篇文章让你从HTML零基础入门前端开发》12.28
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-VRcXH9FM-1672214813897)(./assets/%E7%8E%84%E5%AD%90Shaer-%E4% ...
【视频回放与课件】零基础入门AI开发
今天上午,受广州图书馆邀请,在第一讲<零代码上手人工智能>的基础上,以<零基础入门AI开发>为主题,分四步解锁人工智能学习的概念与开发工具,让您在一小时内轻松掌握人工智能开发要 ...
android 表格控件点击事件,Android零基础入门｜RecyclerView点击事件处理
原标题:Android零基础入门|RecyclerView点击事件处理前面两期学习了RecyclerView的简单使用,并为其item添加了分割线.在实际运用中,无论是List还是Grid效果,基本 ...
基于hadoop的商品推荐系统_[零基础入门推荐系统(1)]基于用户和基于物品的协同过滤方法(python代码实现)...
1. 前言: 为什么会有该系列? 最近,打算写<零基础入门推荐系统>系列,为了系统地介绍推荐系统知识,以及加强基础的实践能力. 该系列将结合一些书籍,比如项亮的<推荐系统实践> ...
零基础学python 视频_零基础入门学习PYTHON(第2版)(微课视频版)
小甲鱼畅销图书重磅升级,针对Python 3.7,通过生动的实例,让读者在实践中理解概念,在轻松.愉快中学会Python! 本书提倡理解为主,应用为王.因此,只要有可能,小甲鱼(注:作者)都会通过生动 ...
什么是python中子类父类_零基础入门：python中子类继承父类的__init__方法实例
前言: 今天为大家带来的内容是零基础入门:python中子类继承父类的__init__方法实例!具有不错的参考意义,希望在此能够帮助到各位!(喜欢的话记得点赞转发关注不迷路哦) 使用Python写过面 ...
python问题分享_零基础入门Python常见问题分享
零基础入门Python常见问题有哪些?作为经常混迹在各大Python技术论坛的小编而言,见到最多的话题就是:学习Python难不难?零基础可以学习Python吗?如何学习Python?等等.今天小编就 ...
长短时记忆神经网络python代码_零基础入门深度学习(6) - 长短时记忆网络(LSTM)
无论即将到来的是大数据时代还是人工智能时代,亦或是传统行业使用人工智能在云上处理大数据的时代,作为一个有理想有追求的程序员,不懂深度学习(Deep Learning)这个超热的技术,会不会感觉马上就o ...
python dict 合并同类项_零基础入门学习Python，这13个Python惯用小技巧一定要收藏...
原标题:零基础入门学习Python,这13个Python惯用小技巧一定要收藏 Python的小技巧很多,入门容易精通难!在进阶的路上,有没有什么好的技巧和好的方法,就是不断总结,不断记笔记!尤其是好的 ...