实际项目就是一个单页面。因此,我觉得用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. 【题解】回文串 APIO 2014 BZOJ 3676 COGS 1985 Manacher+后缀数组+二分

    这题可以用回文自动机来做,但是我并没有学,于是用Manacher+SA的做法O(nlogn)水过 首先,看到回文串就能想到用Manacher 同样还是要利用Manacher能不重复不遗漏地枚举每个回文 ...

  2. flush priviliege

    grant all on *.* to usernmae@'%' identified by '*****'; flush privileges grant all on *.* to root@'% ...

  3. Java 中 给静态方法 添加泛型 (static <T>)

    今天在用到static方法的时候.想要用泛型.结果不能通过编译. 上网查了一下.其具体写法如下:

  4. jmeter进行http压力测试(图文小教程)

    下载地址:http://jmeter.apache.org/download_jmeter.cgi JMeter基于Java开发,需要系统有安装JDK环境.解压后进入bin目录,点击jmeter.ba ...

  5. WPF 添加Adminstrator 权限

    在WPF应用开发中,需要WPF操作后台注册的Windows Service,可是WIX打包的安装程序不具备赋予WPF App默认管理员权限. 因此,需要我们手工在WPF项目中添加管理员权限: 1.右击 ...

  6. PowerDesigner逆向工程

    再用PD建表完成后导成SQL脚本然后在SQL Server中运行后生成数据库后,就想到,可不可以将直接将数据库的内容生成PD文档?经过上网查,当然可以的. 要将SQL Server中的数据库导入到PD ...

  7. 【Foreign】登山 [DP][数学]

    登山 Time Limit: 10 Sec  Memory Limit: 256 MB Description 恶梦是一个登山爱好者,今天他来到了黄山 俗话说的好,不走回头路.所以在黄山,你只能往前走 ...

  8. 【BZOJ2287】消失之物 [分治][DP]

    消失之物 Time Limit: 10 Sec  Memory Limit: 128 MB[Submit][Status][Discuss] Description ftiasch 有 N 个物品, ...

  9. 【洛谷 P1419】 寻找段落(二分答案,单调队列)

    题目链接 开始还以为是尺取.发现行不通. 一看标签二分答案,恍然大悟. 二分一个\(mid\)(实数),把数列里每个数减去\(mid\),然后求前缀和,在用单调队列维护\(sum[i-t\text{~ ...

  10. 使用Redirector插件解决googleapis公共库加载的问题【转】

    转自:http://www.cnblogs.com/kari/p/5860371.html 最近访问一些面向国外的网站总是会出现ajax.googleaips.com无法加载的情况.以下为加载stac ...