1.安装nodejs环境

下载node.js。安装成功后再控制台输入 node -v 出现版本号则,安装成功。

如果没有出现 版本号 而是出现node 不是内部命令的话 需要配置一下环境变量,如果已经出现版本号,此步骤可以忽略。将安装node的路径剪切,右键我的电脑-->属性-->高级系统环境设置-->环境变量-->找到path环境变量。加上复制的node的安装路径。

2.可以在控制台在输入一下命令,查看是否已经成功的安装了npm   npm -v  如果出现版本号说明已经安装成功,

3.下面我们就可以进行,vue 的脚手架的安装了 也就是vue-cli,在控制台输入 npm install -g vue-cli (注意:尽量使用全局安装),等待完成安装即可。

4.我们使用webpake模板生成一个项目   vue init webpack 文件名称,出现如下时显示安装成功

5.安装包依赖   npm install

6.当安装完成后 我们执行,npm run dev 进行运行。如果控制台有出现下面情况说明项目已经启动起来了

浏览器输入localhost:8080时,出现如下的界面:

那么vue我们搭建好了,现在开始集成iview

7.使用脚手架安装iview    npm install iview save

8.成功后添加iview-loader加载器  npm install iview-loader --save-dev

webpack+vue+iview使用vue-cli脚手架搭建的更多相关文章

  1. 使用Vue CLI脚手架搭建vue项目

    本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...

  2. 用 vue cli 脚手架搭建单页面 Vue 应用(进阶2)

    1.配置 Node 环境. 自行百度吧. 安装好了之后,打开 cmd .运行 node -v .显示版本号,就是安装成功了. 注:不要安装8.0.0以上的版本,和 vue-cli 不兼容. 我使用的 ...

  3. 13. Vue CLI脚手架

    一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...

  4. vue搭建cli脚手架环境(出现问题及解决,主要是node版本低)

    Vue 提供了一个官方的cli,为单页面应用 (SPA) 快速搭建繁杂的脚手架. 一.vue cli脚手架 脚手架通过webpack搭建开发环境 使用ES6语法 打包压缩js为一个文件 项目文件在环境 ...

  5. vue/cli 3.0脚手架搭建

    在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli  安装成功:  安装完成 ...

  6. vue cli 框架搭建

    =============== 通知: 博主已迁至<掘金>码字,博客园可能以后不再更新,掘金地址:https://juejin.im/post/5a1a6a6551882534af25a8 ...

  7. 用vue-cli脚手架搭建一个仿网易云音乐的全家桶vue项目

    一,vue-cli环境搭建 1,全局安装webpack npm install webpack -g 2,安装vue脚手架 npm install vue-cli -g 3,新建一个新的project ...

  8. 脚手架搭建vue框架

    一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v  (检查一下 版本): 2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , ...

  9. vue之cli脚手架安装和webpack-simple模板项目生成

    ue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目. GitHub地址是:https://github.com/vuejs/vue-cli 一.安 ...

  10. 1.vue脚手架搭建项目

    前言: 在使用Vue-cli脚手架搭建项目之前,需要安装node.js和npm以及vue-cli. 开始搭建项目: 1.打开cmd win+R 2.转到要搭建的项目路径: g: cd Webapp/v ...

随机推荐

  1. Linux基础入门--04

    目录结构及文件基本操作 实验介绍: 1.Linux 的文件组织目录结构. 2.相对路径和绝对路径. 3.对文件的移动.复制.重命名.编辑等操作. 一.Linux 目录结构 在讲 Linux 目录结构之 ...

  2. 图文转换NABCD

    作为图文转化还是有很多优点的,在这里我就分析一下它的方便快捷 Need:有些非电子版的文字不方便我们编辑,图文转换可以轻而易举达到目的. Approach:现在技术手段应该还有点难度,应该可以换个方法 ...

  3. IO异常 的处理 test

    package com.throwsss; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFou ...

  4. 四则运算(window窗体程序)

    我的第一个程序 忙活了半个下午做出来了,勉强可以见人,虽然还有些瑕疵,但是我也尽力了...... 我做的是一个能对0--10之间的整数进行四则运算的,题目的数据是程序自动生成的,而且程能接收用户输入的 ...

  5. bata1

    目录 组员情况 组员1(组长):胡绪佩 组员3:庄卉 组员4:家灿 组员5:凯琳 组员6:翟丹丹 组员7:何家伟 组员8:政演 组员9:黄鸿杰 组员10:刘一好 组员11:何宇恒 展示组内最新成果 团 ...

  6. Leetcode题库——27.移除元素

    @author: ZZQ @software: PyCharm @file: removeElement.py @time: 2018/9/23 14:04 要求:给定一个数组 nums 和一个值 v ...

  7. java List.get

    并不能 用如果List在i位置值不存在 并不能 List.get(i) !=null 判断 会抛异常 版权声明:本文为博主原创文章,未经博主允许不得转载.

  8. java 对象和基本数据类型 “==”区别

    “==”比较的是地址,牢记.1.对象.integer 是对象 Integer i1 = 20; Integer i2 = 20 ; System.out.println(i1 == i2); // t ...

  9. C语言中的strstr函数

    转自:http://www.cnblogs.com/xy-kidult/archive/2012/12/25/2832460.html 早上翻<C和指针>,碰见一个子串查找问题,这个问题在 ...

  10. Maven解读:项目依赖管理如何优化

    Github地址:https://github.com/zwjlpeng/Maven_Detail Maven最大的好处莫过于其强大的依赖管理系统,在Pom配置文件中指定项目需要的Jar包的坐标,Ma ...