gulp配合vue压缩代码格式化
实际项目就是一个单页面。因此,我觉得用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压缩代码格式化的更多相关文章
- 在vscode中使用eslint+prettier格式化vue项目代码 (转载)
ESlint:javascript代码检测工具,可以配置每次保存时格式化js,但每次保存只格式化一点点,你得连续按住Ctrl+S好几次,才格式化好,自行体会~~ vetur:可以格式化html.标准c ...
- vsCode 设置vue 保存自动格式化代码
setting { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tab ...
- HTML/CSS/Javascript代码在线压缩、格式化(美化)工具
CSS 格式化 ProCSSor - http://procssor.com/ CSS 压缩 CSS Compressor - http://www.cssdrive.com/index.php/ ...
- gulp做的前端代码压缩报错,揭示具体错误 信息
用gulp做的前端代码压缩,今天在打包的时候发现打包出错了.报的错误是--unable to minify JavaScript.但是至于为什么会不能打包,表示很困惑,然后通过一番搜索,最后得出了问题 ...
- vs code中Vue代码格式化的问题
个人网站 https://iiter.cn 程序员导航站 开业啦,欢迎各位观众姥爷赏脸参观,如有意见或建议希望能够不吝赐教! VSCode自从更新之后,vue文件的html代码格式化就失效了,而且vu ...
- vs Code + Eslint + Prettier 代码格式化(vue开发)
一.什么是Eslint 通过查看eslint官网(官网传送门),我们就可以知道,eslint就是一个用来识别 ECMAScript/JavaScript 并且按照规则给出报告的代码检测工具,主要用来检 ...
- vue.js - 解决vue-cli打包后自动压缩代码
一.webpack中引入的压缩代码 /build/webpack.prod.conf.js const OptimizeCSSPlugin = require('optimize-css-assets ...
- 做一个gulp+webpack+vue的单页应用开发架子
1.目标 最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命 ...
- webpack配合vue.js实现完整的单页面demo
本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的 ...
随机推荐
- linux-柔性数组
柔性数组:在C99定义的结构体中,最后一个元素允许是未知大小(或者是0)的数组,它不占用结构体任何内存,这个数组叫做柔性数组,柔性数组前必须至少有一个其它成员. 使用方式: #include<s ...
- c++11新特性之atomic
std::atomic_flag std::atomic_flag是一个原子的布尔类型,可支持两种原子操作: test_and_set, 如果atomic_flag对象被设置,则返回true; 如果a ...
- 题解【luogu P2421 bzoj P1407 [NOI2002]荒岛野人】
洛谷题目链接 bzoj题目链接 题目大意:给定\(n\)组\(C_i, P_i, L_i\),求最小的\(M\)使得对于任意的\(i,j (1 \leq i, j \leq n)\) \[C_i + ...
- bzoj 2434 [Noi2011]阿狸的打字机 AC自动机
[Noi2011]阿狸的打字机 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 4001 Solved: 2198[Submit][Status][D ...
- DOM学习控件定位和案例
Dom中有多种定位属性,下面是一个简单案例 <html><!--制作一个会跟着鼠标走的图像,还有控件定位的案例--> <head> <title>doc ...
- cin.get()、流和缓冲区
大家好,这是我在CSDN的第一篇博客.我是一名学习GIS专业的大学生.我从小开始喜欢编程,可是到现在编程水平却长进不大,依然是菜鸟一个.究其原因,虽然这些年乱七八糟的东西学过不少,但是总的来说还是基础 ...
- Android之实现定位
基于android的定位无非就两种:network.gps.两者各有优劣. Network:定位快,准确度低,受环境影响小. GPS:定位慢,准确度高,受环境影响大. 本文要解决的问题: 1. ...
- js的作用域深入理解
一.什么是作用域 作用域是指对某一变量和方法具有访问权限的代码空间,Javascript的作用域只有两种:全局作用域和本地作用域,本地作用域是按照函数来区分的(即全局变量和局部变量)) 局部变量:只有 ...
- MyBatis框架的使用及源码分析(六) MapperRegistry
我们先Mapper接口的调用方式,见<MyBatis框架中Mapper映射配置的使用及原理解析(一) 配置与使用>的示例: public void findUserById() { Sql ...
- redis常用数据结构解析
Redis是一个开源的Key-Value存储引擎,它支持string.hash.list.set和sorted set等多种值类型.由于其卓越的性能表现.丰富的数据类型及稳定性,广泛用于各种需要k/v ...