Gulp笔记

1、全局安装gulp-cli和gulp

2、package.json文件配置,devDevpendencies 配置对应  $ npm install module_name --save-dev 开发环境

  devpendencies 配置对应 $ npm install module_name  --save   生产环境,可以直接引用加入打包,而不需要再html文件上单独引入依赖了,这样便于版本管理和更新

比如,

window.React = require(‘react‘);window.ReactDOM = require(‘react-dom‘);window.Reflux = require(‘reflux‘);window.ReactRouter = require(‘react-router‘);var injectTapEventPlugin = require(‘react-tap-event-plugin‘);injectTapEventPlugin();

除开gulp需要全局安装,其他的开发目录下本地安装就好, $ npm install module_name --save-dev 或者生产环境安装,全局安装也不是不可,全局安装,其他项目文件下也可以使用,但都要本地安装一次没什么意义

3、npm 运行时有时候,明明安装了该模块,却报该命令不存在之类的,可能是windows环境变量配置问题
时间: 2025-01-07 05:41:13

Gulp笔记的相关文章

《nodejs+gulp+webpack基础实战篇》课程笔记(四)-- 实战演练

一.用gulp 构建前端页面(1)---静态构建 npm install gulp-template --save-dev 通过这个插件,我们可以像写后台模板(譬如PHP)一样写前端页面.我们首先学习一下写法. 现在我们创建一个新任务:创建一个裸的index.html文件,然后在body里面写上 ,我的年龄是:<%= age %> 下载好gulp-template,我们引用并配置 var gulp_tpl = require("gulp-template"); gp.tas

《nodejs+gulp+webpack基础实战篇》课程笔记(七)--利用gulp自动完成配置&quot;吐&quot;给webpack执行

首先,我们利用gulp将入口文件自动化.我们参考该课程的规则,对文件需要成为入口的文件进行一个归类和整理. 首先,我们已经建立了SRC文件夹.在SRC文件下,创建一个主文件夹叫modules.同事创建几个子文件夹,创建的基本规则是:文件夹名就代表了我们的入口节点名. (此图仅供参考,文件夹名与文件名可自定义) 然后我们来到gulpfile.js,写入一个任务,在gulpfile中遍历modules文件夹里的文件夹和子文件(为了演示方便,我们默认遍历2级.第一级必须是文件夹名.第二级必须是js文件

《nodejs+gulp+webpack基础实战篇》课程笔记(八)--模板化开发演练:分离公共头文件

还是先来安装本课需要的插件: npm install raw-loader --save-dev //示例:var header = require("xxx.html");就会把html的内容读取出来 这是一个webpack加载器,可以把文件原样返回为字符串. 这里补充下使用加载器的两种方法: 1.在我们的webpack配置文件中写上 {test:/\.html$/,loader:"加载器名称"} //这代表所有html后缀均会使用这个加载器来处理 2.在requ

《nodejs+gulp+webpack基础实战篇》课程笔记(三)--webpack篇

webpack引入 前面我们简单学习了gulp,这时一个前端构建框架---webpack产生了(模块打包) 它能帮我们把本来需要在服务端运行的JS代码,通过模块的引用和依赖打包成前端可用的静态文件.(这里有需要了解一下CommonJS规范,具体请自行查看http://commonjs.org). 安装webpack: npm install -g wabpack //这里我们采用全局安装,保证每个项目中都能使用到 设置配置文件:  在项目目录下,新建一个webpack.config.js文件 m

《nodejs+gulp+webpack基础实战篇》课程笔记(六)--附加课

一.多页面分离资源引用,按需引用JS和css 我们前面实现了以下功能:1.新建了一个login模版(用到htmlWebpackPlugin).2.分别把main.js和login.js.reg.js分开写.3.学习了css加载器.我们通过webpack可以打包js文件.自动注入js和CSS引用. 那么我们要加载多页面如何操作呢?现在我们就在/src/tpl 文件夹下新件一个index.html文件,在CSS加入index.css,随便写两个样式,然后在/src/下新建一个index.js,随便写

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

先要安装nodejs,初始化项目配置文件package.json,根据情况输入配置参数 npm init 1 test command: 2 git repository: 3 keywords: 4 author: 5 license: (ISC) 6 About to write to E:\temp\20170429\test03\package.json: 7 8 { 9 "name": "test03", 10 "version": &

gulp使用笔记

gulp简介 gulp 是基于 Nodejs 的自动任务运行器,能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试.检查.合并.压缩.格式化.浏览器自动刷新.部署文件生成,并监听文件在改动后重复指定的这些步骤.在实现上, gulp 借鉴了Unix操作系统的管道(pipe)思想,就是前一级的输出,直接变成后一级的输入,使其在操作上非常简单. 安装 gulp是基于node的自动任务运行器,所以需要事先安装好node. 1.全局安装gulp

gulp学习笔记

第一步:安装Node 首先,gulp 是基于 Nodejs 的自动任务运行器,所以安装gulp之前,最基本也最重要的是,我们需要搭建node环境.访问http://nodejs.org,下载并安装Nodejs ,就一切准备就绪.npm会随着安装包一起安装,稍后会用到它. 为了确保Node已经正确安装,我们执行几个简单的命令:node -v 和 npm -v  来查看一下Nodejs 和 npm的版本号.如果这两行命令没有得到返回,可能node就没有安装正确. 第二步:安装gulp 安装gulp

《nodejs+gulp+webpack基础实战篇》课程笔记(五)-- 实战演练,构建用户登录

一.用gulp +webpack构建登录页面(1):简单构建 我们做项目经常要做的“百搭”页面 登录页面 ,它的基本要素如下: 1.页面展示要素 2.基本脚本判断 3.后端交互. 在项目根目录下创建 src(有逼格的名称) --tpl (代表是模板) --login.html(后缀随意) 注意,一旦发布到生产环境, 以上文件是不需要上传到服务器上的. <!--src/tpl/login.html--> <!DOCTYPE html> <html lang="en&q