zoukankan      html  css  js  c++  java
  • webpack对多个模块依赖进行打包

    【 webpack3.0.0刚刚出来  所以文章是跟着低版本 教程 操作熟悉  结果好多对不上喔】

    七:webpack对多个模块依赖进行打包

       通过一刚开始我们了解到 webpack支持commonJS和AMD两种模块机制进行打包,因此我们现在来针对代码中使用commonJS和AMD机制进行做一个demo;

    Src源文件增加module1.js module2.js module3.js 代码分别如下:

    复制代码
    module1.js 代码:
    // module1.js
    require(["./module3"], function(){
        console.log("Hello Webpack!");
    });
    
    Module2.js代码如下:
    // module2.js,使用的是CommonJs机制导出包
    module.exports = function(a, b){
        return a + b;
    }
    
    Module3.js代码使用AMD机制
    
    // module3.js,使用AMD模块机制
    define(['./module2.js'], function(sum){
        return console.log("1 + 2 = " + sum(1, 2));
    });
     // 入口文件 main.js 代码如下:
     require("./module1");
    复制代码

    我们可以运行下 webpack后 在根目录下生成如下文件:

    其中1.build文件夹是commonJS生成的 里面是commonJS的代码;我们再查看页面的代码如下可以看到:

     【操作结果没有这样】

    我们继续查看控制台输出如下:

      【操作结果没有输出】

    为止我们可以看到webpack打包可以支持commonJS模块和AMD模块。

  • 相关阅读:
    pycharm 中查找替换功能
    Python中括号的区别及用途
    python:return
    WAMPSERVER 启动不了APACHE原因
    Python为什么如此不同?
    Python初试云雨情
    mariadb 的日志
    MySql 之UUID()
    python 自建爬虫复用简单框架(gevent异步)
    python分布式进程
  • 原文地址:https://www.cnblogs.com/ertingbo/p/7058234.html
Copyright © 2011-2022 走看看