实际项目就是一个单页面。因此,我觉得用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. Android HandlerThread分析

    基础概念:HandlerThread 是一个包含 Looper 的 Thread,我们可以直接使用这个 Looper 创建 Handler,本质上还是Thread Handler 必须要和 Loope ...

  2. idea一些文件如.xml 文件搜索不到的解决方法

  3. sudoers文件配置

    http://note.drx.tw/2008/01/linuxsudo.html foobar ALL=(ALL) ALL 現在讓我們來看一下那三個 ALL 到底是什麼意思.第一個 ALL 是指網路 ...

  4. Reduce Side Join实现

    关于reduce边join,其最重要的是使用MultipleInputs.addInputPath这个api对不同的表使用不同的Map,然后在每个Map里做一下该表的标识,最后到了Reduce端再根据 ...

  5. Kafka消息delivery可靠性保证(Message Delivery Semantics)

    原文见:http://kafka.apache.org/documentation.html#semantics kafka在生产者和消费者之间的传输是如何保证的,我们可以知道有这么几种可能提供的de ...

  6. book_notes

    http://139.196.8.158/ https://caomall.worktile.com/tasks/projects/58fd73047619c44427c0d719 http://lo ...

  7. iOS通知传值

    NSMutableDictionary *params = [NSMutableDictionary dictionary]; params[@"loginName"] = @&q ...

  8. C# 生成系统唯一号

    生成唯一号:思路,根据yymmddhhmmss+自增长号+唯一服务器号( SystemNo)生成唯一码,总长度19,例如:1509281204550000101. public class Uniqu ...

  9. Problem L. Visual Cube(杭电多校2018年第三场+模拟)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6330 题目: 题意:给你长宽高,让你画出一个正方体. 思路:模拟即可,湘潭邀请赛热身赛原题,不过比那个 ...

  10. 主成分分析(PCA)及其在R里的实现

    主成分分析(principal component analysis,PCA)是一种降维技术,把多个变量化为能够反映原始变量大部分信息的少数几个主成分.设X有p个变量,为n*p阶矩阵,即n个样本的p维 ...