实际项目就是一个单页面。因此,我觉得用gulp足够,并且不需要webpack和vue-cli因为没有必要使用组件。

先来说一下项目结构

1.

然后来看看我的包管理package.json都用了啥,你也可以复制下来,npm install进行安装就行了。

{
"name": "webRoot",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.25.0",
"babel-preset-es2015": "^6.24.1",
"gulp": "^3.9.1",
"gulp-babel": "^7.0.0",
"gulp-concat": "^2.6.1",
"gulp-connect": "^5.0.0",
"gulp-htmlmin": "^3.0.0",
"gulp-imagemin": "^3.3.0",
"gulp-jshint": "^2.0.4",
"gulp-less": "^3.3.2",
"gulp-minify-css": "^1.2.4",
"gulp-notify": "^3.0.0",
"gulp-rename": "^1.2.2",
"gulp-uglify": "^3.0.0",
"imagemin-pngcrush": "^5.1.0",
"jshint": "^2.9.5"
}
}

  然后是我的gulpfile.js配置

这里还是用图片吧,动手敲一敲总还是好的,给以后的自己也找点麻烦。

  

内容不多,但是很实用,所以我不会放弃治疗哒。

gulp配合vue压缩代码格式化的更多相关文章

  1. 在vscode中使用eslint+prettier格式化vue项目代码 (转载)

    ESlint:javascript代码检测工具,可以配置每次保存时格式化js,但每次保存只格式化一点点,你得连续按住Ctrl+S好几次,才格式化好,自行体会~~ vetur:可以格式化html.标准c ...

  2. vsCode 设置vue 保存自动格式化代码

    setting { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tab ...

  3. HTML/CSS/Javascript代码在线压缩、格式化(美化)工具

    CSS 格式化 ProCSSor - http://procssor.com/   CSS 压缩 CSS Compressor - http://www.cssdrive.com/index.php/ ...

  4. gulp做的前端代码压缩报错,揭示具体错误 信息

    用gulp做的前端代码压缩,今天在打包的时候发现打包出错了.报的错误是--unable to minify JavaScript.但是至于为什么会不能打包,表示很困惑,然后通过一番搜索,最后得出了问题 ...

  5. vs code中Vue代码格式化的问题

    个人网站 https://iiter.cn 程序员导航站 开业啦,欢迎各位观众姥爷赏脸参观,如有意见或建议希望能够不吝赐教! VSCode自从更新之后,vue文件的html代码格式化就失效了,而且vu ...

  6. vs Code + Eslint + Prettier 代码格式化(vue开发)

    一.什么是Eslint 通过查看eslint官网(官网传送门),我们就可以知道,eslint就是一个用来识别 ECMAScript/JavaScript 并且按照规则给出报告的代码检测工具,主要用来检 ...

  7. vue.js - 解决vue-cli打包后自动压缩代码

    一.webpack中引入的压缩代码 /build/webpack.prod.conf.js const OptimizeCSSPlugin = require('optimize-css-assets ...

  8. 做一个gulp+webpack+vue的单页应用开发架子

    1.目标 最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命 ...

  9. webpack配合vue.js实现完整的单页面demo

    本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的 ...

随机推荐

  1. UVA 10766 Organising the Organisation

    https://vjudge.net/problem/UVA-10766 题意: n个员工,除总经理外每个人只能有一个直接上级 有m对人不能成为直接的上下级关系 规定k为总经理 问员工分级方案 无向图 ...

  2. 企业CEO最核心的应该是销售意识

    一个企业的本质是赚利润,利润怎么来?靠卖东西,所以企业里面最重要的应该是销售人员.在一些500强的外企里有一个规定,没有做过销售的人是很难升到总经理的,在以色列的军队中,没有当过班长,是不可以被提拔为 ...

  3. uoj308 【UNR #2】UOJ拯救计划

    传送门:http://uoj.ac/problem/308 [题解] 考虑枚举用了$i$所学校,那么贡献为${k \choose i} * cnt * i!$ 意思是从$k$所选$i$所出来染色,$c ...

  4. 省队集训 Day3 吴清华

    [题目大意] 给网格图,共有$n * n$个关键节点,横向.纵向距离均为$d$,那么网格总长度和宽度均为$(n+1) * d + 1$,最外围一圈除了四角是终止节点.要求每个关键节点都要通过线连向终止 ...

  5. 「6月雅礼集训 2017 Day5」仰望星空

    [题目大意] 给你$n$个点,被一个半径为$R$的元圆划分成内(包含边界).外两个部分. 要连若干线,每个点只能连一条线,不存在重点和三点共线. 线只能连在内部点和外部点之间,线长度不超过$d$. 如 ...

  6. 【POJ】1222 EXTENDED LIGHTS OUT

    [算法]高斯消元 [题解] 高斯消元经典题型:异或方程组 poj 1222 高斯消元详解 异或相当于相加后mod2 异或方程组就是把加减消元全部改为异或. 异或性质:00 11为假,01 10为真.与 ...

  7. Vuejs - 单文件组件

    为什么需要单文件组件 在之前的实例中,我们都是通过 Vue.component 或者 components 属性的方式来定义组件,这种方式在很多中小规模的项目中还好,但在复杂的项目中,下面这些缺点就非 ...

  8. Deep learning with Theano 官方中文教程(翻译)(三)——多层感知机(MLP)

    关于更多的http://deeplearning.net/tutorial/的翻译还有学习笔记会陆续整理传到博客. 供大家相互交流和学习,本人水平有限,若有各种大小错误,还请巨牛大牛小牛微牛们立马拍砖 ...

  9. document的属性与方法小结

    document节点是文档的根节点,每张网页都有自己的document节点.属性:1:document.doctype----它是一个对象,包含了当前文档类型 (Document Type Decla ...

  10. 9.0docker的数据管理

    dopcker容器的数据卷          为容器添加数据卷 sudo docker run -v  ~/container data:/data  -it ubuntu /bin/bash   查 ...