js 编写后文件太大,可以使用gulp 来进行压缩。

具体步骤如下:

1.创建一个工作目录

在该目录下安装 gulp

npm install gulp

安装gulp-uglify 模块

npm install gulp-uglify

2.在工作目录下编写脚本gulpfile.js

var gulp = require('gulp')

var uglify = require('gulp-uglify')

gulp.task('script', done => {
// 1\. 找到文件
gulp.src('js/*.js')
// 2\. 压缩文件
.pipe(uglify())
// 3\. 另存压缩后的文件
.pipe(gulp.dest('dist/js'))

done()
})

这个代码的意思是,创建一个script 的任务

1.这个任务先找到 src 目录下的 后缀为 js 的文件

2.将文件进行压缩

3.将文件另存到dist/js 目录下。

3.编写需要压缩的代码 a.js

function demo (msg) {
alert('--------\r\n' + msg + '\r\n--------')
} demo('Hi')

4.执行任务

在工作目录下执行 gulp script 意思是,gulp 会去查找 gulpfile.js 文件,并执行 script 的任务。

5.在dist/js 下找到 a.js

function demo(n){alert("--------\r\n"+n+"\r\n--------")}demo("Hi");

发现js代码确实被压缩了。

 

使用gulp 压缩js的更多相关文章

  1. 《Gulp 入门指南》 : 使用 gulp 压缩 JS

    <Gulp 入门指南> : 使用 gulp 压缩 JS 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 访问论坛获取帮助 压缩 js 代码可降低 js 文件大小,提高页面打 ...

  2. 使用 gulp 压缩 JS

    使用 gulp 压缩 JS 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 压缩 js 代码可降低 js 文件大小,提高页面打开速度.在不利用 gulp 时我们需要通过各种工具手动完成 ...

  3. gulp 压缩js,css

    最近做的前端项目中发现引用的js包太多,导致页面加载时反应很慢,所以首先想到的是将js和css压缩,提高加载速度. 我们先来看看抓到的当前页面响应时间: 页面异步加载,需要响应时间 7.41秒,这也太 ...

  4. gulp 压缩 js 和 css 代码

    我们在写出来的代码都是非常规范的,改换行的时候就换行,改tab 的时候就有tab,还有这样做是为了后期维护方便,但是这也导致了内存占用量的增大,当把把代码发到线上,如果网速慢一点,可能很久都加载不出来 ...

  5. gulp压缩js文件报错日志

    输出 gulp-uglify 压缩js文件时报错信息 gulp.task('es6', function () { return gulp.src('src/main/webapp/bower_com ...

  6. 使用gulp压缩js详细步骤笔记

    先要安装nodejs,初始化项目配置文件package.json,根据情况输入配置参数 npm init test command: git repository: keywords: author: ...

  7. gulp压缩js

    1.安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务 2.查看nodejs的版本号 3.npm ...

  8. Gulp使用入门操作十一步压缩JS

    前提需要安装nodejs 一. 全局安装Gulp npm install -g gulp 二.新建一个 gulpfile.js 文件 chapter2└── gulpfile.js 三.在 gulpf ...

  9. 使用 gulp 压缩 CSS

    请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用 gulp 压缩 JS 压缩 css 代码可降低 css 文件大小,提高页面打开速度. 我们接着将规律转换为 gulp 代码 规律 ...

  10. 使用 gulp 压缩图片

    请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用 gulp 压缩 JS 压缩 图片文件可降低文件大小,提高图片加载速度. 找到规律转换为 gulp 代码 规律 找到 images/ ...

随机推荐

  1. servlet一些笔记、详解

    一.什么是servlet? 处理请求和发送响应的过程是由一种叫做Servlet的程序来完成的,并且Servlet是为了解决实现动态页面而衍生的东西.理解这个的前提是了解一些http协议的东西,并且知道 ...

  2. PHP命令执行与绕过

    一.eval()函数调用--无严格过滤: 1.highlight_file()高亮显示: ?c=highlight_file(base64_decode("ZmxhZy5waHA=" ...

  3. 2024年常用的Net web框架

    ASP.NET Core 框架声明:是微软推出的新一代开源.跨平台的 Web 应用框架,用于构建高性能.现代化的 Web 应用程序. 官网地址:https://dotnet.microsoft.com ...

  4. `operator++(int)` 和 `operator++()`

    operator++(int) 和 operator++() 是 C++ 中重载的两个不同的自增运算符函数,它们分别用于后置自增和前置自增.它们的区别在于调用方式以及自增行为的不同. 1. 前置自增运 ...

  5. 使用Redis的好处

    性能极高--redis能支持超过100K+每秒的读写频率 丰富的数据类型--Redis支持二进制案例的 Strings, Lists, Hashes, Sets 及 Ordered Sets 数据类型 ...

  6. C#通过JS变量提取天天基金API返回的基金净值

    目录 天天基金API 添加项目依赖项 请求 API 数据 获取所有基金代码 获取基金净值信息 功能测试 参考链接 天天基金API 常见的 API 如下: 所有基金代码:http://fund.east ...

  7. 详解 Hough 变换(基本原理与直线检测)

    Hough 变换原理与应用 前言: 详细介绍了 Hough 变换的基本思想.基本原理和应用等.其中大多都是自己的理解,难免有偏差,仅供参考. 文章目录 Hough 变换原理与应用 1. 基本概述 1. ...

  8. c++时间形式转换

    https://cplusplus.com/reference/ctime/ 先放上官方文档. ctime类里,有很多转换时间格式的方法,下面只举例将UTC时间,转换为字符串的代码. ‌‌Unix时间 ...

  9. Linux 安装idea

    前置 Idea2020 Xftp6 步骤 将压缩包通过Xftp6上传到/opt/idea 解压 启动/bin目录下的./idea.sh,配置jdk 此步骤需要在虚拟机的图形界面执行 编写hello.j ...

  10. Mysql高可用架构方案

    目录 Mysql 介绍 高可用结构 主从模式 主从模式介绍 主从复制技术 主从模式注意事项 MHA(MasterHighAvailability) MHA模式介绍 MHA工作流程 MMM(Multi- ...