首先安装各类插件

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. 聊聊MVC和模块化以及MVVM和组件化

    原文链接 小寒的博客,带你理解更深的世界 面向对象,模块化和MVC 面向对象是指把写程序映射到现实生活,从而一来逻辑性更强,更容易写好代码,二来代码很贴切,通俗易懂,更被人理解,三来更加容易拓展和管理 ...

  2. hdu 4563

    hdu 4563 把每个命令走的距离抽象成完全背包 枚举最后一个不是整点走完的命令 #include <iostream> #include <algorithm> #incl ...

  3. Windows安全证书生成方法（开发者证书）

    首先,查看本机安装的证书可在“运行”中输入:certmgr.msc 一.win8.8.1.win10系统,使用管理员powershell创建证书: (1)利用如下命令来创建证书并获取到其指纹 New- ...

  4. momentjs 使用总结

    一.安装 cnpm install moment 二.引入 var moment = require('moment') 三.使用 let today = moment().format('YYYY- ...

  5. PAT甲级——A1008 Elevator

    The highest building in our city has only one elevator. A request list is made up with N positive nu ...

  6. Java学习之二（线程（了解） JVM GC 垃圾回收）

    线程与进程(了解)→JVM→字节码→GC 一.程序 = 算法 + 数据结构(大佬) 二.程序 = 框架 + 业务逻辑(现实) 1.线程与进程.同步与异步 1.1进程是什么? 进程就是操作系统控制的基本 ...

  7. python collections模块 之 orderdict

    普通字典善于隐射,其次追踪插入顺序.而 orderdict 更善于后者.因为 orderdict 内部维护了一个双向链表,大小会是普通字典的两倍. 增加方法: popitem(last=True) 移 ...

  8. Lint found fatal errors while assembling a release target问题的解决方案

    此问题发生在编译为 release 版本时,出现错误提示如下: Lint found fatal errors while assembling a release target. To procee ...

  9. linux使用wget

    wget is a Linux command-line utility for retrieving files from the web, via HTTP, HTTPS and FTP prot ...

  10. #include <filename.h> 和 #include“filename.h” 有什么区别

    对于#include <filename.h> ,编译器从标准库路径开始搜索filename.h,对于#include “filename.h” ,编译器从用户的工作路径开始搜索filen ...