首页 > TAG信息列表 > Gulp

node.js 使用教程-1.使用gulp-file-include插件，实现html复用

前言 做后端开发的时候可以用模板生成html代码，像多个页面一些公共的导航栏，侧边栏都需要复用，方便维护。 纯前端开发，可以用到gulp-file-include编译工具进行一次替换，之后页面html页面就是完整的。 安装gulp-file-include 先安装gulp以及gulp-file-include 先全局安装gulp npm instal

手把手实践教你删除项目当中无用的npm包

清理没有使用的 Unused dependencies * core-js * gulp-concat * gulp-connect * gulp-cssmin * gulp-less * gulp-uglify * open * save-dev Unused devDependencies * @vue/cli-plugin-babel * @vue/cli-plugin-router * clean-webpack-plugin Missing dependencies * gulp-fil

SSCMS文件解析-学习笔记

//声明常量，不可变 const fs = require('fs-extra');//初始化目录插件 const del = require('del');//删除文件的工具 const gulp = require('gulp');//基于流的代码自动化构建工具 const through2 = require('through2');//二次包装自定义插件 const minifier = require('g

使用gulp助力前端自动化

前言 随着前端诸如webpack，rollup，vite的发展，gulp感觉似乎好像被取代了。其实并没有，只不过它从台前退居到了幕后。我们仍然可以在很多项目中看到它的身影，比如elementplus、vant等。现在gulp更多的是做流程化的控制。 比如我们要把一个大象放进冰箱里就需要 打开冰箱门->把大象放进

Webpack笔记

Webpack笔记 模块化 模块化是指把一个复杂的系统分解到多个模块以方便编码。 当项目变大时这种方式将变得难以维护，需要用模块化的思想来组织代码。 CommonJS CommonJS 是一种使用广泛的 JavaScript 模块化规范 核心思想: 是通过 require 方法来同步地加载依赖的其他模块 通过 mo

使用Gulp压缩静态资源

如果希望对在静态页面中引入的相关资源进行压缩（比如：CSS，JavaScript，图片等），可以使用Gulp实现。 当然，还可以其他其他打包工具，比如：Grunt，Webpack等等。 Gulp是什么 Gulp是一个用于对静态Web资源进行打包的工具，可以实现对静态资源的压缩，本质上是一个npm模块。 在正式使用Gulp之前，需要先安

Calling gulp to do stuff with file stream build;

const gulp = require('gulp') const gulpUtil = require('gulp-util') function runGulp() {     gulpUtil.log('stuff happened', 'Really it did', gulpUtil.colors.magenta('123'));     gulp.watch('./*.css�

使用gulp压缩时报错Error [ERR_REQUIRE_ESM]: Must use import to load ES Module

最近升级了一下gulp，发现再次压缩时报错 原因是gulp-imagemin 8.0.0只支持ES6语法，而我用的是CommonJS的语法，在引入模块时使用的是require，所以在使用gulp-imagemin的时候就出错了 解决方法： SyntaxError: Cannot use import statement outside a module STEP1: 将gulpfile.js改为gu

VUE - Cesium编译打包

VUE - Cesium编译打包   官网上下载 cesium 开发包：https://github.com/CesiumGS/cesium.git   安装 cnpm cnpm install   安装gulp,(-g 表示全局安装，可选) cnpm install gulp -g     执行命令 生成Apps文件夹 gulp buildApps   这里会在Build下生成Apps文件夹，内容包

gulp-sass 安装 gulp 编译 scss 文件

下载依赖 npm install gulp-sass sass gulpfile.js const { src, dest, series, watch } = require('gulp') const scss = require('gulp-sass')(require('sass')) const devPath = './src/' const outputPath = './pages/'

【笔记】gulp、webpack、vite的区别

webpack和gulp都是热门的前端构建工具，他们的区别是什么呢？     gulp的官网上是这样介绍的，“gulp是一个工具包，可帮助您自动化开发工作流程中繁重而耗时的任务。”，说明gulp旨在强调自动化前端构造流程，通过用户自定义配置一系列的任务(Task)，并排列好顺序后执行，从而构建自动化流程。

npm常用命令汇总

概要 NPM的全称是Node Package Manager，是随同NodeJS一起安装的包管理和分发工具，它很方便让JavaScript开发者下载、安装、上传以及管理已经安装的包。 本文主要介绍开发中常用的npm命令，旨在让刚刚跨入前端大门的萌新对前端工程化管理工具有个基本的认识，熟悉掌握这些命令以便将更多

Asp-Net-Core开发笔记：使用NPM和gulp管理前端静态文件

前言 本文介绍的是AspNetCore的MVC项目，WebApi+独立前端这种前后端分离的项目就不需要多此一举了~默认前端小伙伴是懂得使用前端工具链的。 为啥要用MVC这种服务端渲染技术呢？ 简单项目不需要强行分离增加复杂度（如：我正在开发的博客项目） 后端渲染利于SEO，对博客网站友好 OK，虽然MVC的

前端多语资源打包及加载的一个可行性方案

前言 在一个比较大的项目里面（有国际化需求的），国际化的支持是一个必不可少的； 那如何落地就得具体问题具体分析了，这里说说我遇到过并落地的一个改造方案； ​ 说说项目背景，是一个迭代多年的产研类项目(整个系统是围绕react生态去研发的)，历史包袱挺多； 多种第三方库并存，也有iframe的

Gulp基础

@目录一、简介二、功能三、Gulp的基本使用步骤四、Gulp中提供的方法gulp.src()gulp.dest()gulp.task()gulp.watch()五、Gulp插件介绍六、简单案例复制文件复制文件夹压缩html文件css文件语法转换与压缩js文件语法版本转换与压缩 gulp.js - 基于流(stream)的自动化构建工具 | gulp

（48）Gulp路由

一、Gulp路由介绍图 我们前面再demo案例中指定过路由，那么我们可能不太清楚路由的原理是什么？那么接下来呢，我们来详细说明一下。 二、Gulp路由详情解析 URL地址：http://localhost:3000指向dist目标目录 那么我们地址栏访问：http://localhost:3000/index.html，那么实际访问的是dist/

（36）Gulp 构建资源（图片）文件

一、Gulp 构建资源（图片）文件概述 所谓Gulp 构建资源（图片）文件就是将图片占用大小压缩后变小。其实我们Gulp构建资源文件不只是单独只图片，还有其他的比如说字体文件，也是资源文件。这里我们拿图片文件演示。 一、Gulp 图片文件所需插件 二、Gulp 构建资源（图片）文件示例 1.安装压缩

gulp 前端自动化构建工具

一、前提： 上班上多了，发现公司的前端脚手架使用到了gulp ，起初不明白这个是干啥的，后来查了一下资料发现原来自己学过啊，然后长时间没有使用，脑子就自动当作没用知识丢弃掉了，还是需要整理一篇文章，供日后使用！   二、学习目标： 1.Gulp的介绍  2.Gulp的安装 3.Gulp的应用   1、Gulp的介

使用gulp和browser-sync实现自动刷新浏览器

安装gulp 全局安装：`npm install -g gulp` 项目安装：`npm install gulp --save-dev` 安装browser-sync 全局安装 `npm install -g browser-sync` 项目安装 `npm install browser-sync --save-dev` 编写代码 在项目根目录下创建文件：gulpfile.js 在gulpfile.js中写入如下

基于node平台项目的gulp自动化构建打包工具

gulp 是一个项目开发的自动化打包构建工具基于 node 环境来运行的 1.cnpm install gulp -g   // 全局安装:为了执行gulp任务2.cnpm install gulp     // 本地安装：为了项目文件调用gulp插件的功能3.gulp -v     // 查看版本号，出现版本号即为安装成功 安装包 -D

npm命令大全

目录 npm是什么 NPM的全称是Node Package Manager，是随同NodeJS一起安装的包管理和分发工具，它很方便让JavaScript开发者下载、安装、上传以及管理已经安装的包。 npm install安装模块 基础语法 npm install (with no args, in package dir) npm install [<@scope>/]<name> npm i

使用gulp构建项目，sass/less编译，js/css/html/image压缩，版本号处理

gulp是一个基于任务的工具 gulpfile.js const gulp = require('gulp'); const sass = require('gulp-sass')(require('sass'));//将scss编译成css const browserSync = require('browser-sync');//微型服务，当资源改动时，浏览器会自动刷新 const minifycss = requir

Grunt+Gulp+Webpack知识点整理

Grunt知识点整理 GRUNT JavaScript 世界的构建工具。中文主页 为何要用构建工具？ 一句话：自动化。对于需要反复重复的任务，例如压缩（minification）、编译、单元测试、linting等，自动化工具可以减轻你的劳动，简化你的工作。当你在 Gruntfile 文件正确配置好了任务，任务运行器就会自动

晶格动力学程序 GULP

大家好，我是木南 分子动力学软件诸多，包括： 1. LAMMPS LAMMPS即Large-scale Atomic/Molecular Massively Parallel Simulator，可以翻译为大规模原子分子并行模拟器，主要用于分子动力学相关的一些计算和模拟工作，一般来讲，分子动力学所涉及到的领域，LAMMPS代码也都涉及到了。LAMMPS可以

gulp相关

gulp简介 gulp是一个自动化构建工具，可以实现各种文件类型的检测，压缩，合并，重命名，部署，将ES6代码转化为ES5等操作 -g：全局 配置环境变量 未被添加-g的模块活命令，只能再当前目录下使用 gulp使用步骤 1.安装gulp软件（对整个node平台安装一遍gulp软件） cnpm install gulp -g 2.创