grunt自动化工具配置指南-优快云博客

1、安装node,去官网下载源码包(最新版自带npm，最好再安装下淘宝镜像 $ npm install -g cnpm --registry=https://registry.npm.taobao.org)

2、安装grunt—cnpm install -g grunt-cli@0.1.13

设置环境变量，GRUNT_USER，名字随便写，小写

3、下载trotoiseSvn工具（如下载语言包请注意对应版本号），迁出项目代码到本地

4、进入代码文件夹，cmd安装以下插件

（所依赖的插件可以查看gruntfile.js文件查看。）

cnpm i grunt-contrib-clean

cnpm i grunt-contrib-jshint

cnpm i grunt-contrib-copy

cnpm i grunt-contrib-concat

cnpm i grunt-contrib-uglify

cnpm i grunt-contrib-watch

cnpm i grunt-html2js@0.2.9

cnpm i underscore

5、\node_modules\_grunt@1.0.2@grunt\lib\grunt这个目录下，打开task.js文件，（我的是393行）搜索task.loadNpmTasks

第二个代码处，

加上

function findTask() {

  var tasksdir = path.join(root, name, 'tasks');

    if (grunt.file.exists(tasksdir)) {

        loadTasks(tasksdir);

      } else {

      if (root) {

      root = path.resolve(root, '../..', 'node_modules');

      findTask();

    } else {

      grunt.log.error('Local Npm module "' + name + '" not found. Is it installed?');

    }

  }

}

findTask();

这段代码。

// // Process task plugins.

// var tasksdir = path.join(root, name, 'tasks');

// if (grunt.file.exists(tasksdir)) {

// loadTasks(tasksdir);

// } else {

// grunt.log.error('Local Npm module "' + name + '" not found. Is it installed?');

// }

加注释！

6、D:\myCode\asset\node_modules\_grunt-html2js@0.2.9@grunt-html2js\tasks\html2js.js

这个目录下，打开html2JS.js文件，全局查找‘ , [] ’全部删除。

然后进入任意子目录下，cmd打开命令行，grunt online,会生成bin和build文件，就OK了。

实际开发中，使用grunt watch就可以了。

每次需要更改线上代码时需要在子目录下的build.config.js文件中去手动修改版本号，module.exports.pkg.version

还需要在子目录下添加grunt用户名，路径对应的是Java静态资源包路径，在

Module.export.location下修改，名称就是自己配置的grunt用户变量名

开发中需要使用grunt watch的话，需要把module.exports.pkg.debug:改为true;

不然会造成入口文件index.jsp 无法加载修改过的文件。

谷歌浏览器可以安装一个livereload插件，配合grunt watch 一起使用。

http://cms.mangoerp.com/login

cms系统

adminerp / adminhelp

启动静态资源服务器：node main.js 修改端口号

需要修改host文件

Hosts文件主要作用是定义IP地址和主机名的映射关系，是一个映射IP地址和主机名的规定。可以用文本文件打开！当用户在浏览器中输入一个需要登录的网址时，系统会首先自动从Hosts文件中寻找对应的IP地址，一旦找到，浏览器会立即打开对应网页，如果没有找到，则浏览器会将网址提交DNS服务器进行IP地址解析。这也是提高快速打开网页的方法！

121.43.41.6 www.mangoerp.com mangoerp.com ws.mangoerp.com

修改host后，就可以指定www.mangoerp.com去访问哪个地址，可以绑定任意IP，

本机开发中，一般是绑定本地IP或者开发服务器IP，这样开发的时候，网页指定加载的资源路径就是自己指定的文件路径。

grunt通过配置的config文件中location对象下的用户名查找本机配置的grunt用户变量是否一致决定是否启动grunt服务，

Grunt watch监听到文件被修改，livereload插件就会启动服务去执行是否需要新的文件，如果需要，就会通过layout文件下的pages文件去指定加载被更改的文件，达到监听有变化自动刷新页面的效果。

开发完毕需要更新到线上，手动提交到svn发布到服务器。

asset（静态资源服务器）文件夹不用修改，不用提交，

开发修改页面之前，需要开启本地静态资源服务器，在asset目录下，cmd进入，node main.js启动

在对应子目录下修改文件，打开cmd, grunt watch,谷歌浏览器livereload点一下变实心。

再去erp中layout目录下,cmd执行grunt，就可以实时监控了。

转载于:https://my.oschina.net/u/3501740/blog/1635844