提前安装了node.js,

https://nodejs.org/zh-cn/download/

跟着提示安装就行,然后执行一下命令cdm看下版本号如下图就说明安装成功了

安装包里面集成了npm,然后我们就可以利用npm命令从获取淘宝镜像的cnpm了。 
1.打开命令行窗口,输入

npm install -g cnpm --registry=https://registry.npm.taobao.org

获取到cnpm以后,输入下面的命令,都用cnpm不需要用$ npm;

cnpm install -g gulp  //全局安装
cnpm install --save-dev gulp //本地安装,只是开发版的依赖
cnpm install --save-dev browser-sync

browser-sync是一个十分好用的浏览器同步测试工具。

// 载入插件
var gulp = require('gulp'),
browserSync = require('browser-sync').create(),//浏览器刷新工具
imagemin = require('gulp-imagemin'),//图片压缩
tinypng = require('gulp-tinypng-nokey');//tinypng图片压缩
minifycss = require('gulp-minify-css'),//css压缩
uglify = require('gulp-uglify'),//js压缩
jshint = require('gulp-jshint'),//js语法检测
rename = require('gulp-rename'),//重命名
gclean = require('gulp-clean'),//清除文件
minimist = require('minimist'),//截取传参
cache = require('gulp-cache'),//获取文件cache
fileinclude = require('gulp-file-include');//静态资源引用

若出现这样的问题:

则继续安装:

cnpm install gulp-imagemin

  

本地安装,模块化显示

gulp实现公共html代码复用

gulpfile.js文件

var gulp = require('gulp');
var fileinclude = require('gulp-file-include'); gulp.task('fileinclude', function () {
gulp.src('src/pages/**/*.html')
.pipe(fileinclude({
prefix: '@@',
basepath: '@file'
}))
.pipe(gulp.dest('dist'));
});

执行gulp fileinclude 命令

文件创建如图:

注意:访问不是打开page里面的index.html,要不然会出现如下图这样:

而是生成出来的dist文件夹里的index.html

测试了一下:

 卸载可以用npm uninstall gulp

uniapp运行打包需要node_modules时,

运行执行命令cmd:npm install就可以了

就可以生成这个文件了。

升级npm执行命令:npm install npm -g

gulp和npm等安装的更多相关文章

  1. JavaScript构建(编绎)系统大比拼:Grunt vs. Gulp vs. NPM

    Nicolas Bevacqua进行了一个比较JavaScript构建(编绎)系统的任务.他对三巨头: Grunt, Gulp and NPM进行了比较,并讨论了每种的优缺点. By Nicolas ...

  2. gulp构建工具的安装

    第一步:node.js安装 在gulp安装之前,本机需要node环境.访问http://nodejs.org,然后点击大大的绿色的install按钮,下载完成后直接运行程序.npm会随着安装包一起安装 ...

  3. gulp自动化构建工具安装使用(1)

    我用的是windows,所以以下操作针对于windows用户,其他系统有不一样的地方请自行查阅资料更正. 好了,废话少说,反正也就是随手捣腾.下雨了,天晴了,我们开始搞gulp了 安装:gulp是个构 ...

  4. npm 全局安装和局部安装的区别

    上图是从网上找的webpack 安装的步骤,我们看到除了要全局安装之外,还需要本地安装,那么这两者有什么区别呢? 本文以Windows平台上做测试,以webpack为示例做教程 什么是全局安装? 安装 ...

  5. Nodejs 及 NPM 的安装

    Nodejs 及 NPM 的安装,有两种方式: 方式1.Nodejs 及 NPM  一起安装 https://nodejs.org/en/download/  下载  Windows Installe ...

  6. Windows环境下的NodeJS+NPM+Bower安装配置步骤

    Windows下的NodeJS安装是比较方便的(v0.6.0版本之后,支持windows native),只需要登陆官网(http://nodejs.org/),便可以看到首页的“INSTALL”按钮 ...

  7. windows下的Nodejs及npm的安装、常用命令,Nodejs开发环境配置

    http://www.cnblogs.com/webstorm/p/5744942.html ***************************************** 第一步:下载Nodej ...

  8. [转] npm 模块安装机制简介

    npm 是 Node 的模块管理器,功能极其强大.它是 Node 获得成功的重要原因之一. 正因为有了npm,我们只要一行命令,就能安装别人写好的模块 . $ npm install 本文介绍 npm ...

  9. npm 模块安装机制简介

    npm 是 Node 的模块管理器,功能极其强大.它是 Node 获得成功的重要原因之一. 正因为有了npm,我们只要一行命令,就能安装别人写好的模块 . $ npm install 本文介绍 npm ...

随机推荐

  1. PAT T1015 Letter-moving Gam

    双下标法找最长公共子序列(不能删除字符) #include<bits/stdc++.h> using namespace std; ; string s; string t; int ma ...

  2. mapreduce程序执行过程

    1.客户端程序,设置作业相关的配置和计算输入分片信息,向RM获取一个JOBID,提交作业信息(分片)到以作业ID为目录下,通知APP——MASTER 2.APP——MASTER,读取指定目录下的作业信 ...

  3. 七 Spring的分模块开发的配置,保存客户案例

    Spring的分模块开发的配置 加载配置文件的时候,加载多个 在一个配置文件中引入多个配置文件(常用) 保存客户案例 applicationContext.xml: <?xml version= ...

  4. 吴裕雄--天生自然PythonDjangoWeb企业开发:解决Pythonno module named "XX"问题

    在项目中加入 sys.path.append('你的django项目路径') sys.path.append('python的site-packages路径')

  5. shell脚本中执行sql命令

    1.mysql 数据库表信息 2.shell脚本(a.sh)信息 #!/bin/sh mysql -u root << myInsert insert into test.t values ...

  6. centso7设置防火墙

    CentOS 7默认使用的是firewall作为防火墙,使用iptables必须重新设置一下 1.直接关闭防火墙 1 2 3 systemctl stop firewalld.service #停止f ...

  7. 【剑指Offer面试编程题】题目1388:跳台阶--九度OJ

    题目描述: 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法. 输入: 输入可能包含多个测试样例,对于每个测试案例, 输入包括一个整数n(1<=n< ...

  8. jquery 操作单选框,复选框,下拉列表实现代码

    1.复选框全选操作:其实说到底就是对Jquery 选择器的运用,点我查看Jquery选择器 html代码: 复制代码代码如下: <form> 您爱好的运动是: <input type ...

  9. MySQL日常使用笔记

    逍遥山人的MySQL使用笔记,持续更新中 表结构 新建表以及添加表和字段的注释 create table t_user( ID INT(11) primary key auto_increment c ...

  10. Python 动态从文件中导入类或函数的方法

    假设模块文件名是data_used_to_test.py,放在tests文件夹下 文件夹结构如下: project |-tests |-data_used_to_test.py 文件内包含一个test ...