前端自动化构建工具 - FIS3 - 第六节: amd模块化支持

前言

个人感觉就是用来规范格式化输出你的amd 代码，书写规范参考commonjs。

安装插件

需要安装2个插件

sudo npm install -g fis3-hook-amd
sudo npm install -g fis3-hook-commonjs

说明
https://www.npmjs.com/package/fis3-hook-amd

实战

项目准备

/amd-module
/static
/static/require.js

包下载地址
http://requirejs.org/
http://jquery.com/

创建amd-module模块

/amd-module/center/order.js

define(function (require, exports, module) {

    var config = require("../system/config");
    console.log(config.serverip());

    exports.list = function(){
        return "产品列表...";
    };

});

/amd-module/system/config.js

define(function (require, exports, module) {

    exports.serverip = function () {
        return "127.0.0.1";
    };

});

/amd-module/system/cart.js

exports.hello = function () {
    return "hello";
};

调用app页面

/app/index.html

配置fis-conf.js文件

// 开启 amd 插件
fis.hook('amd');

// 指定哪些需要被格式化的模块js
fis.match('/amd-module/**/*.js', {
    isMod: true
    //release: '/static/$0'
});

// 需要排除的文件
fis.match('/static/require.js', {
    isMod: false
});

测试运行

fis3 release

查看被格式化的模块

amd-module/center/order.js

define('amd-module/center/order', ['require', 'exports', 'module', "amd-module/system/config"], function (require, exports, module) {

    var config = require("amd-module/system/config");
    console.log(config.serverip());

    exports.list = function(){
        return "产品列表...";
    };

});

amd-module/system/cart.js

define('amd-module/system/cart', ['require', 'exports', 'module'], function(require, exports, module) {

  exports.hello = function () {
      return "hello";
  };

});

amd-module/system/config.js

define('amd-module/system/config', ['require', 'exports', 'module'], function (require, exports, module) {

    exports.serverip = function () {
        return "127.0.0.1";
    };

});

代码

https://github.com/hans007/JavaScriptCodes/tree/master/fis3/use-amd

我的博客