首先安装各类插件

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. linux 软件 手动添加至桌面或启动栏

    1.创建软连接(也可以不用创建软连接,直接写绝对路径) sudo ln -s /opt/eclipse/eclipse /usr/bin/eclipse 2.创建desktop文件 sudo gedi ...

  2. 使用jqselectable构建美化的select元素

    本文只对此插件的应用做一些探讨,本插件版权属于原作者,插件原始下载地址:http://www.jq22.com/jquery-info288 原插件也有些许不足之处,比如样式定义名称太过普通,容易和页 ...

  3. Error-IDEA:“Import from external model” 与 “Create from existing source”的区别

    ylbtech-Error-IDEA:“Import from external model” 与 “Create from existing source”的区别 1.返回顶部 1. “Import ...

  4. GC 案例收集整理

    1.数组动态扩容  现象:系统一直在做cms gc,但是老生代一直不降下去,但是执行一次jmap -histo:live之后,也就是主动触发一次full gc之后,通过jstat -gcutil来看老 ...

  5. SpringIOC自定义属性编辑器PropertyEditor

    Spring中我们可以使用属性编辑器来将特定的字符串转换为对象 String--转换-->object java.beans.PropertyEditor(JDK中的接口)用于将xml文件中字符 ...

  6. 2019-2-18-VisualStudio-给项目添加特殊的-Nuget-的链接

    title author date CreateTime categories VisualStudio 给项目添加特殊的 Nuget 的链接 lindexi 2019-02-18 15:56:48 ...

  7. zimage 和bzimage 有什么区别

    在网络中,不少服务器采用的是Linux系统.为了进一步提高服务器的性能,可能需要根据特定的硬件及需求重新编译Linux内核.编译Linux 内核,需要根据规定的步骤进行,编译内核过程中涉及到几个重要的 ...

  8. Luogu P3558 [POI2013]BAJ-Bytecomputer(线性dp)

    P3558 [POI2013]BAJ-Bytecomputer 题意 给一个只包含\(-1,0,1\)的数列,每次操作可以让a[i]+=a[i-1],求最少操作次数使得序列单调不降.若无解则输出BRA ...

  9. 用JSON将一个字典写入到文件,通过loads()将JSON字符串在转换为本来的类型

    通过dumps将字典转换为JSON的字符串,存到磁盘里面

  10. java中通过jacob调用dts进行数据导入导出

    在一个项目中需要金蝶软件对接,但是业务服务器和财务服务器相隔很远(中间经过好几台服务器,有内网也有外网),从一个内网向另一个内网中传输时,需要外网辅助,因为不让原始数据受污染,使用了DTS数据同步到另 ...