首先介绍一下命令行构建一个vue项目步骤：

1、下载安装node.js（直接运行安装包根据步骤安装完），打开命令行输入：node -v ，出现版本号即安装成功。

2、命令行界面输入：cnpm install vue-cli -g，全局安装vue.cli脚手架，输入vue list 出现如下信息即可。

3、选择一个目录创建项目文件夹，cd命令到该文件夹，输入命令：vue init webpack  ”项目名称“，根据提示填写对应信息和设置安装事项。

4、项目创建完成后，会出现两个命令，依次输入执行就可以运行项目，使用浏览器打开最后出现的提示地址就可以看到vue项目的初始化界面。

5、如此：vue项目创建完毕，接下来就可以在各种开发工具中导入vue项目进行下一步开发了。

初学者快速构建一个vue项目：

下载安装HBuilder X 工具：http://www.dcloud.io/hbuilderx.html

左上角文件→新建→项目，在项目面板中选择vue项目

项目结构如下：

运行项目：确保该项目的必须包都已下载好，没有的话先执行npm install。执行操作同下，两种皆可。

菜单运行方式：运行→运行到终端→npm run serve，出现运行地址后到浏览器运行即可。 命令方式：右键vue项目→使用命令行窗口打开所在目录(A)→输入命令：npm run serve→回车执行，得到一样的运行结果

快速构建一个vue项目的更多相关文章

  1. 利用 vue-cli 构建一个 Vue 项目

    一.项目初始构建 现在如果要构建一个 Vue 的项目,最方便的方式,莫过于使用官方的 vue-cli . 首先,咱们先来全局安装 vue-cli ,打开命令行工具,输入以下命令: $ npm inst ...

  2. springboot：快速构建一个springboot项目

    前言: springboot作为springcloud的基础,springboot的热度一直很高,所以就有了这个springboot系列,花些时间来了解和学习为自己做技术储备,以备不时之需[手动滑稽] ...

  3. 构建一个Vue项目

    一 我们需要安装vue.js Vue.js官网 当我们已经安装了vue-cli,那么我们需要更新Vue-cli. vue-cli3.0使用及配置 二 安装好了之后: 我们可以直接使用命令:mkdir ...

  4. 不借助vue-cli，自行构建一个vue项目

    前言: 对于刚刚接触vue的同学来说,直接用官方的构建工具vue-cli来生成一个项目结构会存在一些疑惑,比如:   .vue组件 为什么可以写成三段式(tempalte.script.style)? ...

  5. [开源]快速构建一个WebApi项目

    项目代码:MasterChief.DotNet.ProjectTemplate.WebApi 示例代码:https://github.com/YanZhiwei/MasterChief.Project ...

  6. 快速构建一个springboot项目（一）

     前言: springcloud是新一代的微服务框架而springboot作为springcloud的基础,很有必要对springboot深入学习一下. springboot能做什么? (1)spri ...

  7. 快速创建一个vue项目

    vue脚手架 用来创建vue项目的工具包 创建项目: npm install -g vue-cli vue init webpack VueDemo 开发环境运行: cd VueDemo npm in ...

  8. 【springBoot】之快速构建一个web项目

    基于maven,首先看pom文件 <parent> <groupId>org.springframework.boot</groupId> <artifact ...

  9. 快速构建一个简单的单页vue应用

    技术栈 vue-cli webpack vux,vux-loader less,less-loader vue-jsonp vue-scroller ES6 vue-cli:一个vue脚手架工具,利用 ...

随机推荐

  1. 利用s3-test进行ceph的接口兼容性测试

    前言 ceph的rgw能够提供一个兼容性的s3的接口,既然是兼容性,当然不可能是所有接口都会兼容,那么我们需要有一个工具来进行接口的验证以及测试,这个在其他测试工具里面有类似的posix接口验证工具, ...

  2. 系统运行后修改linux系统时区

    在网上看了很多改时间的帖子,都没能最终解决问题.最后还是下面的博客最终解决的时间的问题,感谢原作者 安装系统过程时没有选对当前的时区,即CST,Asia/Shanghai,而是按默认的,EDT时区,这 ...

  3. 在Service中创建全局Dialog对话框

    需要使用到悬浮窗权限 val builder: AlertDialog.Builder = AlertDialog.Builder(this)builder.setMessage("from ...

  4. 关于点击弹框外部区域弹框关闭的交互处理（前端JS）

    常见需求场景 前端在处理交互的时候,经常遇到这样的场景,点击一个按钮,出现一个弹框,点击外部区域,弹框关闭. 解决方法 思路说明: 1.给弹框的div父级都加个类名,如: 2.在document绑定一 ...

  5. CorelDRAW复制及镜面反转对象

    复制的设计都是由简单的图案和基础的操作堆砌而成的,如何恰当地使用这些基础操作,就是各位新学者要格外注意的地方. 这次我们介绍CorelDRAW中的复制和镜面操作. 一.复制 1.复制单个对象 使用Co ...

  6. 【Camtasia教学】如何添加光标效果

    随着网络技术的快速发展,手机等移动工具越来越普及,我们的生活也发生了很大的变化,例如我们以前必须去到学校才能学习知识,但是现在躺在床上都可以看国外的教学视频.所以在网上录制教学或者演示视频变得越来越常 ...

  7. Guitar Pro指弹入门——特殊拍号

    在吉他演奏技术不断提高的同时,我们经常会遇到一些奇怪的曲谱.他们的拍号不是正常的4/4拍或者3/4拍,而是5/4或者5/8等等我们不太了解的拍号,致使我们在演奏和练习之中陷入纷乱的节奏. 那么本期文章 ...

  8. mac下让iterm2记住远程ssh连接

    brew安装sshpass brew install http://git.io/sshpass.rb 在根目录下建立passowrd目录用来管理密码,vim testserver 输入明文密码,保存 ...

  9. Ubuntu14.04下安装Composer

    下载Composer: curl -sS https://getcomposer.org/installer | php 安装Composer: /usr/bin/php composer.phar ...

  10. 一键加Q群的实现

    打开网址 选择创建的群 选择所需要的二维码或者代码