首先安装各类插件

npm install vue-cli -g

vue init webpack demo

npm install iview --save

npm install less style-loader css-loader less-loader -D

 npm install iview-loader --save-dev

在demo\build\webpack.base.conf.js中的extensions



需要增加一个.less



在build/webpack.base.conf.js中的module， 改写平时 vue-loader 的配置，如下：



使用npm run dev运行

vue-li+webpack+iview构建项目步骤的更多相关文章

  1. webpack进阶构建项目(一)

    webpack进阶构建项目(一) 阅读目录 1.理解webpack加载器 2.html-webpack-plugin学习 3.压缩js与css 4.理解less-loader加载器的使用 5.理解ba ...

  2. VUE + vue-cli + webpack 创建新项目

    首先记录一下命令. 这是一个睿智新手的笔记. p.s.这是配置好环境以后的命令. ----------------------------------------------- $ npm insta ...

  3. vue构建项目步骤

    1.node版本请更新到6.9.X版本以上,不然npm依赖会出问题 2.命令行里运行npm install --global vue-cli 3.npm install --global webpac ...

  4. [转]webpack进阶构建项目(一)

    阅读目录 1.理解webpack加载器 2.html-webpack-plugin学习 3.压缩js与css 4.理解less-loader加载器的使用 5.理解babel-loader加载器 6.理 ...

  5. VUE + vue-cli + webpack 创建新项目（2）

    上一篇其实没写完. 好吧这一篇其实也没啥. 就补充一些上一篇没写完的.(随时害怕笔记本丢失的人) 上一篇写完了登录验证的跳转,这一片首先补充一下接口(?). 在使用axios的过程中,我们家后台表示你 ...

  6. webpack进阶构建项目(一)：1.理解webpack加载器

    1.理解webpack加载器 webpack的设计理念,所有资源都是“模块”,webpack内部实现了一套资源加载机制,这与Requirejs.Sea.js.Browserify等实现有所不同. We ...

  7. Vue2+VueRouter2+webpack 构建项目实战（一）：准备工作

    环境准备 首先,要开始工作之前,还是需要把环境搭建好.需要的环境是nodejs+npm,当然现在安装node都自带了npm. 在终端下面输入命令node -v会有版本号出来.就说明安装成功了.输入np ...

  8. vue 概念与使用vue-cli脚手架快速构建项目

    vue 定义:是一套构建用户界面的渐进式框架,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合. 数据渲染机制: 核心: 响应式数据绑定 ...

  9. Vue.js：使用vue-cli快速构建项目

    vue-cli是什么? vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. vue-cli怎么使用? 安装vue-cli之前,需要先安装了vue和webpack,不知道怎么安 ...

随机推荐

  1. [洛谷P2472] [SCOI2007]蜥蜴

    题目链接: 蜥蜴 题目分析: 一道网络流,先来分析一下问题: 在一个\(r*c\)的图中分布了一些数,其他地方都用\(0\)填充,我们分别从指定的一些数出发,每次可以移动到周围距离为\(d\)以内的数 ...

  2. SEO-----网站不被收录的原因

    1.  新站的收录较慢 2. 文章质量不高 文章难以阅读  排版乱 内容是别的网站采集来的  很难被收录 3. 网站被降权中 4. 蜘蛛不访问[网站配置] 检查网站是否屏蔽了蜘蛛的爬取[ robots ...

  3. iOS之CALayer属性简介

    /* CoreAnimation - CALayer.h Copyright (c) 2006-2017, Apple Inc. All rights reserved. */ #import < ...

  4. Netty ByteBuf泄露定位修改。

    1. ByteBuf 2. 问题描述 日志记录中报堆外内存溢出. 3. 问题定位及修改 Netty提供了ByteBuf泄露的检测机制. JVM启动参数中添加: -Dio.netty.leakDetec ...

  5. 09_springmvc异常处理

    一.异常处理思路 系统中异常包括两类:预期异常和运行时异常RuntimeException,前者通过捕获异常从而获取异常信息,后者主要通过规范代码开发.测试通过手段减少运行时异常的发生. 系统的dao ...

  6. ucore 地址映射的几个阶段

    第零阶段: 启动之后的实模式阶段 vir = lin = pa 第一阶段 : 启动 bootloader 的段式分页 这里段基址是0 ,所以地址空间维持不变 vir addr = lin addr = ...

  7. filters和scope在ElasticSearch Faceting模块的应用

    filters和scope在ElasticSearch Faceting模块的应用 使用ElasticSearch的Facet功能时,有一些关键点需要记住.首先,faceting的结果只会基于查询结果 ...

  8. Lp- Linux必学的60个命令

    1.作用 lp是打印文件的命令,使用权限是所有用户. 2.格式 lp [-c][-d][-m][-number][-title][-p] 3.主要参数 -c:先拷贝文件再打印. -d:打印队列文件. ...

  9. Odoo文档管理/知识管理应用实践 - 上传附件

    测试环境: Odoo8.0 Odoo中的文档管理/知识管理可用于保存采购.销售.生产等一系列业务流程中产生的文件.凭证,可关联到具体的每一笔业务操作:也能用于管理公司的合同.资料,创建知识库以分享内部 ...

  10. leyou_06_Nginx的自启

    1.在linux系统的/etc/init.d/目录下创建nginx文件 vim /etc/init.d/nginx 添加以下内容 #!/bin/sh # # nginx - this script s ...