模块/包 与Common.js

本文深入探讨Node.js中的Common.js规范,包括内置模块如path、url等的使用,第三方模块的下载安装及引用方法,以及自定义模块的定义与导出。同时对比了前端模块化如AMD、CMD和es6模块化的特点。

Node.js使用了Common.js规范

Node.js中Common.js规范有三种使用类型:

  1. 内置模块 path url fs precess 等等

    内置模块注重的是模块的使用。
    使用步骤;

    1. 先引入模块,然后用一个变量保存这个模块
    var path = require( "path" );
    
    1. 使用这个模块上的 api (方法);~
      例:
         path.join();
         path.resolve();
      
      以上两个api,将一个目录的名称拼接到一个磁盘路径上.
  2. 第三方模块(插件)

    1. 存放地址(库):http://npmjs.com 注重文档阅读能力
    2. 下载安装
      生产环境安装:cnpm i name -S;
      开发环境安装:cnpm i name -D;
    3. 引用 与内置模块引用方法相同
  3. 自定义模块

    1. 定义变量 然后导出模块
     //两种导出方式:
       //第一种
         module.exports = "变量名";
       //第2种
         module.exports = {
           变量名
         };
    
    1. 导入模块
      如果是第一种方式导出, var 变量名 = require( 相对路径 )

      如果是第二种方式导出, var { 变量名 } = require ( 相对路径 )

前端模块化

  1. AMD ( require.js )
  2. CMD ( sea.js )
  3. Common.js ( module.export require )
  4. es6 模块化 ( export import )
webpack.builtinblocks.config.js module.exports = { entry: { AnnotatableBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/html/display.js', './xmodule/js/src/annotatable/display.js', './xmodule/js/src/javascript_loader.js', './xmodule/js/src/collapsible.js' ], AnnotatableBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/raw/edit/xml.js' ], ConditionalBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/conditional/display.js', './xmodule/js/src/javascript_loader.js', './xmodule/js/src/collapsible.js' ], ConditionalBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/sequence/edit.js' ], CustomTagBlockDisplay: './xmodule/js/src/xmodule.js', CustomTagBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/raw/edit/xml.js' ], HtmlBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/html/display.js', './xmodule/js/src/javascript_loader.js', './xmodule/js/src/collapsible.js', './xmodule/js/src/html/imageModal.js', './xmodule/js/common_static/js/vendor/draggabilly.js' ], HtmlBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/html/edit.js' ], LibraryContentBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/vertical/edit.js' ], LTIBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/lti/lti.js' ], LTIBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/raw/edit/metadata-only.js' ], PollBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/javascript_loader.js', './xmodule/js/src/poll/poll.js', './xmodule/js/src/poll/poll_main.js' ], PollBlockEditor: './xmodule/js/src/xmodule.js', ProblemBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/javascript_loader.js', './xmodule/js/src/capa/display.js', './xmodule/js/src/collapsible.js', './xmodule/js/src/capa/imageinput.js', './xmodule/js/src/capa/schematic.js' ], ProblemBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/problem/edit.js' ], SequenceBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/sequence/display.js' ], SequenceBlockEditor: './xmodule/js/src/xmodule.js', SplitTestBlockDisplay: './xmodule/js/src/xmodule.js', SplitTestBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/sequence/edit.js' ], VideoBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/video/10_main.js' ], VideoBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/tabs/tabs-aggregator.js' ], WordCloudBlockDisplay: [ './xmodule/js/src/xmodule.js', './xmodule/assets/word_cloud/src/js/word_cloud.js' ], WordCloudBlockEditor: [ './xmodule/js/src/xmodule.js', './xmodule/js/src/raw/edit/metadata-only.js' ] } };
最新发布
09-25
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值