• 什么叫做webpack模块


    1:ES6
    
    import方式
    import MyModule from './my-module.js';
    import { NamedExport } from './other-module.js';
    
    export方式
    // 具名导出
    export var Count = 5;
    export function Multiply(a, b) {
      return a * b;
    }
    
    // 默认导出
    export default {
      // Some data...
    }
    
    //
    export 和 export default的区别
    1.1:export与export default均可用于导出常量、函数、文件、模块等
    1.2:在一个文件或模块中,export、import可以有多个,export default仅有一个
    1.3:通过export方式导出,在导入时要加{ }(import * 的时候不需要加 {} ),export default则不需要 
    1.4:export能直接导出变量表达式,export default不行。
    //
    
    
    动态加载模块import()
    import('path/to/module') -> Promise
    2:CommonJS
    
    require方式(同步)
    var $ = require("jquery");
    var myModule = require("my-module");
    
    require.resolve通过模块的id(同步)
    
    exports导出方式
    exports === module.exports === {}
    用白话讲就是,exports只辅助module.exports操作内存中的数据,辛辛苦苦各种操作数据完,
    累得要死,结果到最后真正被require出去的内容还是module.exports的,真是好苦逼啊
    3:AMD
    
    define引入
    define(['jquery', 'my-module'], function($, myModule) {
      // 使用 $ 和 myModule 做一些操作……
    
      // 导出一个函数
      return function doSomething() {
        // ...
      };
    });
    4:@import
    @import statement inside of a css/sass/less file.
    5:样式(url(...))或 HTML 文件(<img src=...>)中的图片链接(image url)
    image url in a stylesheet (url(...)) or html (<img src=...>) file
    6:总结
    require: node 和 es6 都支持的引入
    export / import / export default : 只有es6 支持的导出引入
    module.exports / exports: 只有 node 支持的导出
    不忘初心,不负梦想
  • 相关阅读:
    Netty源码分析第4章(pipeline)---->第5节: 传播outbound事件
    Netty源码分析第4章(pipeline)---->第4节: 传播inbound事件
    Google地图路线规划
    bootstrap Table 中给某一特定值设置table选中
    枚举类型定义
    日期格式转换 java 2016-09-03T00:00:00.000+08:00
    String字符串针对常量池的优化
    【转】MySQL性能优化的最佳21条经验
    【转】 jquery遍历json数组方法
    如何设置tomcat定时自动重启
  • 原文地址:https://www.cnblogs.com/panrui1994/p/11896314.html
Copyright © 2020-2023  润新知