使用gulp搭建web服务器

最新推荐文章于 2022-01-18 23:49:09 发布

2008winstar

最新推荐文章于 2022-01-18 23:49:09 发布

阅读量1.5k

点赞数

分类专栏： Gulp 文章标签： gulp 自动化

本文链接：https://blog.csdn.net/winstar1688/article/details/44160013

版权

Gulp 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

gulp是一个node.js模块，也是前端自动化任务构建工具。

使用gulp，可以做以下工作：文件拷贝、文件合并、文本替换、图片压缩、CSS压缩、js压缩等等，当然这些工作主要是依靠gulp的相应插件来完成的。

本系列将介绍如何使用gulp来搭建一个Web服务器，并在这个服务器上完成上述一些工作。

（1）初始化安装

创建一个项目目录：gulp

在这个目录下执行

npm install --save-dev gulp gulp-connect

完成后会把相应的npm模块（gulp、gulp-connect）安装在项目目录下。

（2）创建gulpfile.js配置文件

/**
 * @file file description here
 * @author winstar1688
 */
var gulp = require('gulp');
var connect = require('gulp-connect');

gulp.task('webserver', function () {
    connect.server();
});

gulp.task('default', ['webserver']);

（3）创建一个默认首页index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Demo</title>
</head>
<body>
    <h1>Hello Gulp!</h1>
</body>
</html>

（4）启动Gulp Web服务器

在命令行中进入项目目录gulp，然后执行gulp命令，如图：

这样Web服务器变启动了……

（5）在浏览器中验证

在浏览器地址栏中输入http://localhost:8080/，运行结果如图：

这样一个简单的Web服务器便完成了。

2008winstar

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用gulp搭建web服务器

gulp是一个node.js模块，也是前端自动化任务构建工具。使用gulp，可以做以下工作：文件拷贝、文件合并、文本替换、图片压缩、CSS压缩、js压缩等等，当然这些工作主要是依靠gulp的相应插件来完成的。本系列将介绍如何使用gulp来搭建一个Web服务器，并在这个服务器上完成上述一些工作。（1）初始化安装创建一个项目目录：gulp在这个目录下执行npm inst
复制链接

扫一扫