图解使用vue-cli创建Vuejs项目

本篇将和大家介绍使用vue-cli创建Vuejs项目的步骤，希望对大家的工作和学习有所帮助！

操作方法

  • 01

    首先从官方网站下载安装Node.js，建议使用6.x版本，同时也会一并安装npm工具，npm>3.10以上。

  • 02

    npm安装很慢（国外服务器），所以一般推荐使用npm淘宝镜像cnpm，先安装下cnpm: npm install -g cnpm --registry=https://registry.npm.taobao.org 安装好cnpm后，以后使用npm的地方就可以使用cnpm替代了。

  • 03

    全局安装vue-cli，如下图所示： cnpm install -g vue-cli

  • 04

    在任意一个盘创建一个vue文件夹方便存放，我是在D盘下创建，然后切换到这个文件夹下，如下图所示：

  • 05

    创建一个webpack项目例如：rss2，如下图所示： vue init webpack rss2

  • 06

    一路回车确认，遇到选(y/n)基本上选y，如下图所示： 到最后在D盘vue文件夹下面就会有初始化的项目rss2

  • 07

    进入项目rss2文件里，如下图所示： cd rss2

  • 08

    安装依赖，如下图所示：

  • 09

    运行项目，如下图所示：

  • 10

    这一行命令代表着它会去找到package.json的scripts对象，执行node bulid/dev-server.js。 之后自动打开默认浏览器，如下图所示：

  • 11

    使用vue-cli创建项目到此结束。 如果要终止命令行操作: ctrl+c。

赞 (0)

相关推荐

  • 会声会影创建新项目的快捷键是什么

    会声会影创建新项目的快捷键是Ctrl+N。

  • visual studio 2010怎么创建c项目?

    本文旨在介绍Microsoft Visual Studio 2010如何创建C项目,并编写一个简单的测试程序,为C的初级开发者提供帮助. 1.首先,打开Microsoft Visual Studio ...

  • excel2016怎么创建水平项目符号列表?

    excel2016中想要使用SmartArt创建水平项目符号列表,用于显示没有顺序的列表信息数据,该怎么制作呢?下面我们就来看看详细的教程. 1.在excel中,点击“插入”菜单中的“SmartArt ...

  • Axure怎么创建团队项目?

    Axure8需要对于当前中的新建团队项目的上操作,该怎么新建团队项目呢?下面我们就来看看详细的教程. 1.首先,在Axure8的打开一个的界面当中,打开编辑的文件. 2.点击了的Axure8的菜单中的 ...

  • 怎么删除android studio创建的项目

    怎么删除android studio创建的项目

    android studio是谷歌推出的一个Android集成开发工具,有些用户想知道怎么删除创建的项目,接下来小编就给大家介绍一下具体的操作步骤.具体如下:1. 首先第一步根据下图所示,打开电脑中的 ...

  • 怎么在PS创建视频项目

    怎么在PS创建视频项目

    PS是一款功能强大的图片.视频编辑软件,有些新用户不知道怎么在PS创建视频项目,接下来小编就给大家介绍一下具体的操作步骤.具体如下:1. 首先第一步打开电脑中的PS软件,根据下图所示,点击[文件]选项 ...

  • myeclipse创建web项目

    对于开发新手来说创建web项目通常无从下手,因为菜单里的选项有很多,通常不知道该点哪一个,在哪一步又该注意些什么,今天就写一个myeclipse创建web项目的,总的来说还是很简单的,下面就手把手的教 ...

  • STS如何创建Maven项目

    本介绍下如何用IDE创建maven项目,我用的Spring Tool Suite简称STS,因为现在大多数项目都用的是spring mvc,而STS是针对srping开发的集成工具,而且集成了mave ...

  • 怎样创建scrapy项目，怎样简单运行scrapy

    scrapy是一种爬虫框架,今天小编我就来跟大家分享一下怎样创建scrapy项目以及运行scrapy项目的方法,这样让各位学习爬虫的小伙伴更好的练习 scrapy爬虫. 操作方法 01 准备工作当然是 ...