Vue搭建项目(Day1)搭建脚手架Vue-cli

原创 2018年04月16日 17:50:11

一、环境安装

  要搭建vue-cli需要先在本机有node和npm的环境。

  进入node官网下载node.js然后安装在本地,安装成功后npm也会自动安装成功。如何查看是否安装了呢?打开控制台在上面输入node -v 查看node版本号,输入npm -v查看npm版本号。如出现版本号则证明已经安装成功,如下图:

二、创建vue-cli项目

  安装vue-cli环境,在命令行里输入以下命令(全局安装):

$ npm install -g vue-cli

  安装完成之后再全局安装webpack打包工具:

$ npm install webpack -g

安装成功之后用命令行创建一个文件夹或者cd进入事先准备好的文件夹里,开始安装(创建一个名字叫myProject的项目):

$ vue init webpack myProject

然后根据提示一路操作:

安装完成之后根据提示安装依赖运行:

npm install
npm run dev

网页上输入localhost:8080即可看见自动生成的模板。

手摸手教你搭建vue-cli脚手架-详细步骤图文解析[vue入门]

写在前面:使用 vue-cli 可以快速创建 vue 项目,vue-cli很好用,但是在最初搭建环境安装vue-cli及相关内容的时候,对一些人来说是很头疼的一件事情,本人在搭建vue-cli的项目环...
  • OBKoro1
  • OBKoro1
  • 2017年08月05日 20:22
  • 5619

vue.js之路(1)——vue-cli脚手架的搭建

相比于主流的angular和react前端框架,vue在近年来也变得非常火热。他吸取了前两者的优点,同时学习曲线也更加平缓。所以本魔王准备入坑了~~ 首先从vue的脚手架搭建开始吧。 这里不得不吐...
  • u013034014
  • u013034014
  • 2017年01月03日 16:34
  • 22436

windows 下用vue-cli脚手架工具创建vue项目及遇到的相关问题

vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目,GitHub地址是:https://github.com/vuejs/vue-cli ...
  • sanjtu
  • sanjtu
  • 2017年06月22日 23:06
  • 1413

最详细的安装一个vue项目,利用了vue-cli脚手架

1.vue-cli是基于node.js的所以必须安装node.js及其对于的包管理工具npm或者cnpm。 用命令行生成vue项目框架需要npm包管理器来安装,而npm又是在安装nodejs的时候同...
  • a419419
  • a419419
  • 2017年09月11日 22:22
  • 458

vue.js脚手架搭建

使用 Vue.js 开发大型应用时,我们需要考虑代码目录结构、项目构建和部署、热加载、代码单元测试等事情。如果每个项目都要手动完成这些工作,那无疑效率是低下的,所以通常我们会使用一些脚手架工具来帮助完...
  • Mean_
  • Mean_
  • 2017年09月01日 11:11
  • 472

使用vue-cli脚手架在vs code 建立vue项目

使用vs code 建立vue项目 我们可以参考vue官网  传送门 1.首先我们要先安装nodejs 和 npm (百度有很多教程) 2.我们主要是解读vu...
  • qq_34131399
  • qq_34131399
  • 2018年01月20日 11:29
  • 188

Vue学习之环境构建--------vue-cli构建vue项目

周围的朋友一直都在说vue的优点,之前一直在看angular,抱着好奇心学习了vue,想从最基础的地方记录我的vue。首先第一步离不开环境的搭建,那么就来记录我的vue环境搭建之路。 同作为前端的流...
  • diligentkong
  • diligentkong
  • 2017年07月12日 19:46
  • 573

vue-cli脚手架构建Vue项目及相关配置

Vue是移动端H5开发比较流行的一个MVVM框架,它是以数据驱动的,不需要像jQuery那样操作DOM,而是通过将DOM和数据绑定,利用Object.defineProperty中的setter/ge...
  • oucqsy
  • oucqsy
  • 2017年07月13日 19:47
  • 590

Vue-Webpack简单脚手架搭建

搭建简单的Vue脚手架 基本安装 mkdir vue-demo && cd vue-demo npm init -y cnpm install --save-dev webpack html-...
  • wu_boy
  • wu_boy
  • 2017年08月20日 17:20
  • 837

vue框架搭建的详细步骤之脚手架(一)

在这里我们先快速的搭建一个vue的脚手架: (1).在安装vue的环境之前,安装NodeJS环境是必须的。可以使用node -v指令检查,需要保证安装了4.0版本以上的nodeJS环境。 没有安装的...
  • zmm13298329239
  • zmm13298329239
  • 2017年09月01日 14:33
  • 281
收藏助手
不良信息举报
您举报文章:Vue搭建项目(Day1)搭建脚手架Vue-cli
举报原因:
原因补充:

(最多只允许输入30个字)