Code Monkey home page Code Monkey logo

nfe.js's Introduction

模块化使用规范(nfe.js)

nfejs遵循CMD规范

define(id?, deps?, function(require, exports, module){
     //todo something
});

###ID定义规范:

在编码过程中,统一使用匿名模块化,即:define(function(require, exports, module){});

然后使用打包工具,自动加入id和依赖

如果使用nfe打包,则直接按node编码方式进行编码,不需要define包装,交由nfe处理

其中新增两个关键字,谨慎使用(exports, module)

加载外部依赖,使用绝对路径 加载内部依赖,使用相对路径(基于相对路径,可以做自动合并)

相对依赖的id确认:基于当前模块的id,而不是模块的路径

如:

define('a/b/c', function(require, exports, module){
     require('./d'); //这里d的id则为a/b/d
});

然后通过alias匹配对应的真实路径,接着通过paths做路径映射,如果得到的真实路径为URL,则之间返回,否则真实路径为baseUrl + id + '.js'

####匹配流程:

id -> alias[id] -> paths -> url

相对依赖关系只和id有关,与真实url无关

nfe.use中,不允许出现相对路径

####QA:

  • 加载外部依赖,如何确定id?

    如果设置了alias,则id为alias中对应的key值(建议),否则id为应用路径

  • 加载内部依赖,如何确定id?

    从文件的绝对路径中去除掉baseUrl之后的剩余部, 如: a.js 位于 /static/js/home/a.js中,其中 baseUrl: /static/js/ 则该文件的id为:'home/a'

  • 外部依赖的子依赖如何确定id?

    不允许外部依赖出现子依赖,如果存在,则提前合并到主程序中。

nfe.js's People

Contributors

mfylee avatar

Watchers

 avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.