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. Windows下安装Nessus 10.8.3安装破解教程

    1.下载: 下载地址:https://www.tenable.com/downloads/nessus 浏览器访问 https://127.0.0.1:8834 重点:Register offline ...

  2. CPU性能测试基准(Dhrystone)学习

    简介 Dhrystone是测量处理器运算能力的最常见基准程序之一,常用于处理器的整型运算性能的测量.程序是用C语言编写的,因此C编译器的编译效率对测试结果也有很大影响. Dhrystone是由Rein ...

  3. 2022年3月中国数据库排行榜:TiDB “三连降”仍霸榜首,“常胜四将军”得分集体下跌

    春暖花开好时光,三月一号迎榜来.2022年3月的 中国数据库流行度排行榜 已在墨天轮社区发布,本月共有 199个 数据库参与排名,相比上月新增四个数据库.排名前十的数据库得分均有所波动,整体排名变动略 ...

  4. 墨天轮沙龙 | 北京大学李文杰:面向知识图谱应用的图数据库系统gStore

    在6月8日举办的[墨天轮数据库沙龙第七期-开源生态专场]中,北京大学重庆大数据研究院图数据库与知识图谱实验室副主任.北京大学王选计算机研究所全职博士后 李文杰老师分享了<面向知识图谱应用的图数据 ...

  5. dotnet定义扩展方法

    // 扩展方法 // 1.创建静态类静态方法 2. 在静态方法中参数中使用 this 关键字指定需要扩展的类 // 密封类 不能直接继承,通过扩展方法,拿到父类的属性和方法进行扩展补充

  6. 基于腾讯云短信接口和nodejs服务器实现手机号验证码

    知识储备:js基础.nodejs基础.ajax基础: 1. 手机验证码原理 表单提交,把手机号码传送到后端:后端拿到手机号码后根据相关算法随机形成一个验证码,并将其保存在数据库:用户拿到验证码后将验证 ...

  7. Python之py9-py9博客情况获取

    #!/usr/bin/env python # -*- coding:utf-8 -*- import os import re import datetime import requests url ...

  8. day01-markdown学习

    markdown学习 标题 两个#号 三级标题 四级标题 字体 hello world!两个*加粗 hello world!一个*斜体 hello world!三个*斜体加粗 hello world! ...

  9. centos7.6源码方式安装python3.6.8

    1 安装依赖包 centos7.6是没有自带python3的 [root@opgs201 ~]# cat /etc/redhat-release CentOS Linux release 7.6.18 ...

  10. 在mac上配置nginx 并将前端的打包文件运行

    .markdown-body { line-height: 1.75; font-weight: 400; font-size: 16px; overflow-x: hidden; color: rg ...