在学习前,先谈谈大致使用gulp的步骤,给读者以初步的认识.首先当然是安装nodejs,通过nodejs的npm全局安装和项目安装gulp,其次在项目里安装所需要的gulp插件,然后新建gulp的配置文件gulpfile.js并写好配置信息(定义gulp任务),最后通过命令提示符运行gulp任务即可. 安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务 1.安装nodejs 1.1.说明:gulp是基于…

SCSS语法: 假设变量申明带有!default,那么如果在此申明之前没有这个变量的申明,则用这个值,反之如果之前有申明,则用申明的值. ‘...’传递多个参数: @mixin box-shadow($shadow...){ -webkit-box-shadow:$shadow; -moz-box-shadow:$shadow; box-shadow:$shadow; } 用在属性或者选择器上,就得以#{}包裹 多个变量值一起申明: $linkColor: red blue !default;…

一.node 1.什么是node? 它不是JS文件,也不是JS框架,而是Server side JavaScript runtime,当服务端的一个JS文件运行时,会被NODE拦截,在NODE中运行JS代码.JS由ES(ECMAScript),DOM,BOM 组成,目前运行在浏览器内核中,NODE中只能运行ECMAScript,无法使用DOM,BOM. NODE就是一个JS运行环境.主要用于开发WEB应用程序开发,很多前端开发的工具都是基于NODE这个平台,所有的工具就相当于一些软件. 2.什么…

1 Git 分布式代码管理工具(基于Linux,可在本地进行提交)代码同时储存在本地和服务器中 ① Git基本操作命令 (1)初始化,创建初始化仓库 git init ------- 文件初始化,初始一个仓库,一般在根文件夹执行,创建一个.git的隐藏文件夹 ls ------- 查看根文件中的文件 ls -a-------查看根文件中的文件的路径 (2)配置信息,创建个人信息 git config ------- 开启文件配置 git config ------- 开启文件配置, git co…

NPM安装之后CMD中不能使用 这个情况就是path环境变量没有添加NPM 添加环境变量并重启CMD C:\Users\Mark\AppData\Roaming\npm\ 看看这个文件夹就知道为什么要加这个到path了 前端依赖管理 - bower 这个你得有git npm install -g bower bower install <name>=<package>#<version> 参考链接:https://www.phodal.com/blog/use-bowe…

在工作流相关的第一篇博客中,我们安装了nodejs的环境,那么nodejs自带的npm是一个功能十分强大的管理器,它已经不仅仅是局限于nodejs的版本管理器了,那么当现在我们可以通过npm来下载我们需要使用的各种包,我们需要知道的是,nodejs是一个模块化的用法,它的各个功能都封装成一个一个的模块部分,关于模块的详细部分在nodejs部分再去详细介绍.那么既然它是由模块组成的,那么我们有时候就需要给我们本地的项目区添加各个模块,添加完成之后,我们自己在本地用着很爽,那当项目发布的时候,或者我…

npm即nodejs package manager ,是nodeJs的包管理工具,使用前需安装nodeJs(https://www.npmjs.com.cn/getting-started/installing-node/) bower,Bower是一个客户端技术的软件包管理器,它可用于搜索.安装和卸载如JavaScript.HTML.CSS之类的网络资源.bower从远程git仓库获取代码包,使用前需安装git; 打开命令窗口: 查看已安装的版本 全局安装gulp 在项目目录下 npm in…

这边将工作中使用的npm以及gulp的一些方法做了整理,方便以后查阅,至少不用去麻烦度娘了~ A.npm的使用: 1.在你所需要的文件夹里面初始化npm-->  npm init -y    --->会生成一个package.json文件 2.根据需要下载相应的文件-->   npm install jquery --save  或者  npm install jquery --save-dev   --->这两种做法都会在package.json文件里面生成一个当前文件的版本号,…

前言 本文介绍的是AspNetCore的MVC项目,WebApi+独立前端这种前后端分离的项目就不需要多此一举了~默认前端小伙伴是懂得使用前端工具链的. 为啥要用MVC这种服务端渲染技术呢? 简单项目不需要强行分离增加复杂度(如:我正在开发的博客项目) 后端渲染利于SEO,对博客网站友好 OK,虽然MVC的技术老了点,但依然可以结合现代前端工具链来提高效率 本文的食用需要先安装好Node.js环境,下载地址:https://nodejs.org/en/download 在开始前,先看看我们的项目…

前言 之前写了一篇<Asp-Net-Core开发笔记:使用NPM和gulp管理前端静态文件>,现在又来用Django开发项目了,之前我搞了一个Django的快速开发脚手架「DjangoStarter」,正好给升级一下~ 关于npm和gulp我就不多重复了,之前那篇文章都写了,直接上操作 安装依赖 安装依赖的操作跟上一篇文章是一样的,不过我这里直接提供package.json文件,复制到项目根目录里面,然后直接执行命令安装依赖. package.json文件如下: { "name&qu…

node: http://nodejs.cn/ npm: 随node一起安装了 gulp: http://www.gulpjs.com.cn/docs/getting-started/ bower: https://bower.io/ ionic:npm install cordova ionic -g…

Unix命令行程序和内建指令(百度百科) 将less编译成css的gulp插件 淘宝cnpm镜像 gulp教程之gulp-less gulp入门指南 查找npm的package.json的name配置项中拟设置的name是否重名 npm package.json属性详解[桃子哥] 搞明白各种license 明天接着看 新手应该如何入门前端 豪情前辈 张鑫旭前辈  叶小钗前辈 高扬的小站  简书 segmentfault 前端乱炖 手把手教你如何使用webpack+react…

<Target Name="RunNpm" AfterTargets="AfterBuild">   <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->   <Exec Command="npm install --no-optional --no-package-lock --noi-shri…

npm的使用 node Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,是一种JavaScript语言运行平台,和浏览器这个运行平台是同一个概念. npm npm平台包管理工具(Node Package Manager):通过一套命令统一管理常用的类库.平时用npm下载jquery.bootstrap.angular等插件.库或框架. npm的安装 node.js官网下载:https://nodejs.org/en/ 安装完成后,shift+鼠标右键,选择…

1.先安装node.js ,官网下载地址:https://nodejs.org/en/ 2.安装完node之后,npm自动就安装了.可以直接在visual studio code 通过命令查看 node -v npm -v 3.由于npm的镜像国内的网络不行,我们需要将npm 镜像指向淘宝的npm镜像,执行命令 npm install -g cnpm --registry=https://registry.npm.taobao.org 4.接下来,所有npm相关的命令,我们都用 cnpm来代替,…

script如下 "test":"gulp --gulpfile test.js" 运行 npm run test ,提示编译错误 解决办法如下: 增加script "start":"npm run test", "test":"gulp --gulpfile test.js" 运行如命令即可:npm run start…

npm常用命令: 检查npm模块的安装情况:(以常用模块 grunt为例说明) 1) 检查是否全局安装了模块Grunt: $npm list -g grunt 2) 列出所有已经全局安装的模块:$npm list -g 3) 检查已安装模块的版本$npm view grunt version 显示所有一级dependencies的版本npm ls --depth=0 在 package.json中, tilde(~) and caret(^)的区别? https://stackoverflow.…

原文链接:[gulpfile.js文件常见配置]…

Gulp安装流程.使用方法及CMD常用命令导览 来自前端小白的gulp及周边知识学习总结 一.名词介绍: Npm--node包管理工具 一开始我不理解,包管理工具是什么鬼.后来用到的gulp也好,gulp的插件包也好,都是要在npm这个里边弄出来的. 可以理解为,一个硬盘,里边放的各种整理好的.适用于各种功能的且不重复的文件夹(插件),然后我们需要啥,就去里边摘下来. 当然也可以用它来删除插件 //反正基于他的命令语句就有很多,常用的我先搞到这里 //其他相应的放到相应上下文中好了,本来打算单独…

提前安装了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…

项目环境配置 nvm:   node版本管理工具,安装和环境变量         cmd常用命令: · nvm use [version]: 切换至指定版本的node · nvm install node:安装最新版本的 node.js,nvm i == nvm install · nvm install [version]:安装指定版本的node.js · nvm use [version]:安装某个版本的node · nvm list:列出了当前安装了那些版本的node · nvm unin…

随着前端工程化的趋势,产生了越来越多的构建工具,而其中比较优秀的就是grunt,npm,gulp,今天我来说说这三者间的区别以及他们的优缺点. 相信一般前端开发者选择构建工具的时候,更多的是看个人习惯以及团队的情况.相信这三个构建工具总有一个会适合你的,我们先来看看grunt. Grunt grunt是目前社区最成熟,插件支持最多的一个构建工具,不过它的配置项之多也常常被人诟病.下面就一个简单的例子来说说它的用法. grunt运行之前需要全局安装命令行工具,本地安装grunt插件 npm ins…

一.安装 1)安装nodejs 通过nodejs的npm安装gulp,插件也可以通过npm安装.windows系统是个.msi工具,只要一直下一步即可,软件会自动在写入环境变量中,这样就能在cmd命令窗口中直接使用node或npm指令.…

今年上半年在学习gulp的使用,对npm的掌握是必不可少的,经常到npm官网查询文档让我感到不爽,还不如整理了一些常用的命令到自己博客上,于是根据自己的理解简单翻译过来,终于有点输出,想学习npm这块的朋友不可错过这些基础命令,新手出品,对本文有疑惑之处还请同学们不耻下问.很久没有写文章啦,后续也希望自己在nodejs这方面有多点内容产出. 本文以Windows平台上做测试,以gulp为示例做教程 目录(更新于201601214) npm是什么 npm install 安装模块 npm unin…

本文版权桂博客园和作者吴双共同所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/p/6016055.html 写在前面 大家好我是博客园的蜗牛,博客园的蜗牛就是我.学习这篇文章,你不需要任何nodejs基础,当然你有的话就更顺利了.园子里有很多全栈或者是前端后台数据库都有需要你发光发热的人.也许你很喜欢做着这样的事儿,也许你不喜欢但是难以逃脱这样的安排.但是,无论你是前端,还是后端,还是全栈,好的工具和方法总是很重要的.当你在VS里写前端页面时,一遍又一遍的…

前端构建工具gulpjs的使用介绍及技巧 gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nodejs中stream来读取和操作数据,其速度更快.如果你还没有使用过前端构建工具,或者觉得gruntjs太难用的话,那就尝试一下gulp吧. 本文导航: gulp的安装 开始使用gulp gulp的API介绍 一些常用的gulp插件 1.gulp的安装 首先确保你已经正确安装了nodejs环境.然后…

一.构建gulp环境 1.下载nodejs gulp基于node.js,要通过nodejs的npm安装gulp,所以要先安装node.js环境.(英文官网/中文官网链接). 通过cmd命令窗口确定安装node.js.(在命令窗口输入node -v或npm -v 查看是否返回出版本号). 2.全局安装gulp 确定正确安装了nodejs环境,然后通过命令全局方式安装gulp: npm install gulp -g 或者 cnpm install gulp -g 二.项目流程 1.生成项目所需信息…

Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 1.搭建web服务器 2.文件保存时自动重载浏览器 3.使用预处理器如Sass.LESS 4.优化资源,比如压缩CSS.JavaScript.压缩图片 当然Gulp能做的远不止这些.如果你够疯狂,你甚至可以使用它搭建一个静态页面生成器.Gulp真的足够强大,但你必须学会驾驭它. 这是这篇文章的主要目的.帮助你了解Gulp的基础用法,助你早日完成一统天下的大业. 我们将要做的 这篇文章的最后,你会拥有简单的一个工作流: 编译Sass…

1.安装node-v6.3.0-x64,安装成功后再点击node-v6.3.0-x64卸载(点击remove). 2.安装node-v4.4.7-x64. 3.打开cmd命令行,输入node -v,查看下版本,如果有显示版本,说明已经安装成功. 4.输入npm -v,查看下npm的版本,如果有显示版本,说明已经安装成功. 5.输入npm install -g gulp命令,安装全局的gulp. 6.安装好后输入gulp -v查看版本,如果有显示版本,说明已经安装成功. 7.在C盘新建个项目,在项…

前端自动化流程工具,用来合并文件,压缩等. Gulp官网 http://gulpjs.com/ Gulp中文网 http://www.gulpjs.com.cn/ Gulp中文文档 https://github.com/lisposter/gulp-docs-zh-cn Gulp插件网 http://gulpjs.com/plugins/ Awesome Gulp https://github.com/alferov/awesome-gulp StuQ-Gulp实战和原理解析 http://i5…