【疑难杂症】webpack的module和CommonJS的module有什么区别呢，ES6 Module有这个module对象吗？

已于 2022-06-07 15:43:40 修改
阅读量137 收藏
点赞数
分类专栏： 疑难杂症 文章标签： webpack javascript 前端
于 2022-06-07 15:30:14 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42647547/article/details/125166343
版权

1. webpack的module和CommonJS的module有什么区别呢，ES6 Module有这个module对象吗？

CommonJs封装了一个module对象，Es6 module是通过关键字来实现的

webpack实现了2种不同方式的兼容，但不能混用

如果用es6 module就用es6 module，commonJs就用commonjs

webpack兼容commonJs必然会有一个module对象

2. 为什么这里就能混用呢？

前面是es6 module 的方式引入，后面是用的CommonJS的module对象

在这里插入图片描述

只是引入方式不能混用，这里不是引入方式，所以可以使用

小管打天下
关注
专栏目录
webpack4.0各个击破（5）—— Module篇
weixin_34019144的博客
08-29 204
webpack4.0各个击破（5）—— Module篇 webpack作为前端最火的构建工具，是前端自动化工具链最重要的部分，使用门槛较高。本系列是笔者自己的学习记录，比较基础，希望通过问题 + 解决方式的模式，以前端构建中遇到的具体需求为出发点，学习webpack工具中相应的处理办法。（本篇中的参数配置及使用方式均基于webpack4.0版本） 使用webpack对脚本进行合并是非常方便的...
Webpack学习笔记 01、Module模块系统
每个人都是独一无二的，把握好自己的节奏，跟着自己的心走。
05-09 1279
文章目录前言一、Module出现的原因1.1、最初引入js文件的方式(原始引入与立即调用函数表达式方式)1.2、使用Module模块系统管理(初次使用)二、Module模块方式与使用前提条件2.1、引入Module模块方式(两种)2.2、前提条件三、Module的两种导出与导入方式一：export default导出与import导入(只能单个)方式二：export导出与import引入(单、多个)基本使用导出导入时起别名整体导入(导入到一个对象中，* as obj)export与eport default
Webpack初步接触（一）
E_li_na的博客
05-14 435
官网v3.5.5 1. 简介 一个大现代js应用程序的模块打包工具（module bundler）。webpack可以纯粹在服务端运行。 当webpack处理应用程序时，它会递归地构建一个依赖关系图，其中包含应用程序需要地每个模块，然后将所有地这些模块打包成少量的bundle,通常只有一个，由浏览器加载。它是高度可配置的。 2.概念 1）入口entry webpack创建应...
webpack之module.rules
richest_qi的博客
04-22 9717
AMD是require.js在推广过程中对模块定义的规范化产出； CMD是sea.js在推广过程中对模块定义的规范化产出。 它们都是为了实现js在浏览器端的模块化开发，且异步加载。 其中，require.js中有全局require和局部require，而sea.js中只有局部require。 本文主要是为了记录下二者的使用，便于日后回忆使用
webpack系列之五module生成2
weixin_33851177的博客
04-30 977
作者：崔静 在上一篇 module生成1中我们已经分析了 webpack 是如何根据 entry 配置找到对应的文件的，接下来就是将文件转为 module 了。这个长长的过程，可以分成下面几个阶段 create: 准备数据，生成 module 实例。 add: 信息保存到 Compilation 实例上。 build: 分析文件内容。 processDep: 处理3步骤中解析得到的依赖，添加...
以COM对象处理Excel疑难杂症
07-21
在IT行业中，尤其是在自动化处理和数据操作的场景下，我们经常需要与Microsoft Office应用程序进行交互，Excel尤为常见。本文将深入探讨如何利用COM（Component Object Model）对象来解决处理Excel时遇到的各种复杂...
把脉linux的疑难杂症
01-19
当然理解是需要一个过程，如果安装单机的linux可能让你感觉顺手，可是不容易加深你对系统的理解，是安装多系统的，对比思考，事半功倍。　下面是一些问题集锦，虽然小，可是的确非常有用，虽然是入门级的，可是不积...
嵌入式系统/ARM技术中的把脉linux的疑难杂症
10-21
当然理解是需要一个过程，如果安装单机的linux可能让你感觉顺手，可是不容易加深你对系统的理解，最好是安装多系统的，对比思考，事半功倍。　下面是一些问题集锦，虽然小，可是的确非常有用，虽然是入门级的，可是...
浅析电脑疑难杂症 jp.docx
10-13
【电脑疑难杂症】是指在使用计算机过程中遇到的复杂或难以解决的问题，这些问题可能是硬件故障、软件冲突、系统错误或是网络连接问题等。本篇文章主要从网络中的PAT、主板的PAT以及过程分析技术（PAT）三个方面进行...
windows安装卸载疑难杂症解决包
10-19
这个文件通常用于识别和解决安装或卸载 Microsoft 产品时出现的问题。它可以帮助用户修复由于安装或卸载过程中出现的错误而导致的软件相关问题。 通过运行这个诊断程序，用户可以让系统自动检测和解决安装或卸载...
如何在 webpack 中引入未模块化的库，如 Zepto
热门推荐
大灰狼的小绵羊哥哥的博客
04-23 1万+
前言 原文链接： https://sebastianblade.com/how-to-import-unmodular-library-like-zepto/ 最近我在研究多页面 webpack 模块打包的完整解决方案时，发现用 import 导入 Zepto 时，会报 Uncaught TypeError: Cannot read property 'createElemen
深入 webpack 核心原理
薛定谔的猫-前端领域
05-27 505
名词简介 Entry：编译入口，webpack 编译的起点； Compiler：编译管理器，webpack 启动后会创建 compiler 对象，该对象一直存活知道结束退出； Compilation：单次编辑过程的管理器，比如 watch = true 时，运行过程中只有一个compiler 但每次文件变更触发重新编译时，都会创建一个新的 compilation 对象； Dependence：依赖对象，webpack 基于该类型记录模块间依赖关系； Module：webpack 内部所有资源都会.
Webpack 打包 commonjs 和 esmodule 动态引入模块的产物对比
小王的技术库
06-30 757
⚠️超长代码预警，需要几个小时的时间去啃，但读懂以后应该会很开心。新建一个 文件夹，包含几个 文件，和一个 方法。其中 就是一个简单的加法模块。 和 都是一个 对象。 然后我们提供一个 模块，可以根据用户传入的参数，来引入不同的 文件返回给用户。 需要注意的上边 传入的模块名一定不能是一个纯变量，比如 ，不然 就不知道该打包哪些文件了。上边我们限定了目录位置 和文件名后缀 。这样 就会把 文件夹下所有的 文件进行打包。主函数 来调用 方法。 可以看一下控制台是正常输出：
Vue 2 中，使用Vite作为前端构建开发工具，替代webpack（二）常见问题——和webpack 入口文件同名冲突 & 将commonjs转化为es module-cjs2esmodule
weixin_44867717的博客
04-11 6388
Vue 2 中，使用Vite作为前端构建开发工具，替代webpack（二）常见问题——和webpack 入口文件同名冲突 & 将commonjs转化为es module-cjs2esmodule 常用问题【踩坑】 1、 vite 目前要求入口文件必须是根目录下的 index.html，如果之前的 webpack 入口文件同名，需要更改。 解决方案：vite.config.js: import { injectHtml } from 'vite-plugin-html'; export default
commonJS规范下的webpack
NurTuam—何永杰
07-22 425
为什么要使用webpack 假设:a.js 依赖 b.jsb.js 依赖 c.jsc.js 依赖 d.js 所以在前端去引用这些依赖的时候,往往是这样的: <script src='a.js'></script> <script src='b.js'></script> <script src='c.js'></sc...
C++成员初始化列表
qq_33215865的博客
02-15 326
类的成员变量一般在构造函数调用之前就被创建，当我们的类中有常量，或者引用变量时，我们无法在构造函数中对常量进行赋值。 class Queue{ private: int* front; int* rear; const int size; int &amp; foo; public: Queue(int, int&amp;); ~Queue();...
模块化commonJs和es6，babel和webpack
weixin_49547540的博客
03-02 896
module.exports和exports是属于commonJs规范 export和export default是ES6模块规范 commonjs模块输出的是值的浅拷贝，输出后被改变，其他引用模块不会改变 同步 存在本地硬盘，加载快 node.js 运行时加载 浏览器不支持 ES6模块输出的是值的引用 (输出后被改变，其他引用模块会改变) 编译时输出接口 webpack的tree-shaking只能作用于ES6模块，就是因为ES6模块在编译时就能确定依赖 node 运行文件不支持es6语法 浏览器
库打包工具 rollup
最新发布
CaptainDrake的博客
11-09 922
Rollup 概念、使用、基础配置
【宝藏】浏览器端的模块化问题（1）
weixin_53961451的博客
11-08 483
通过使用构建工具，如 webpack，我们可以有效地解决浏览器端模块化带来的效率、兼容性和工具问题。构建工具将开发时态的代码转换为运行时态所需的高效、兼容的代码，从而使前端项目的规模化成为可能。
Java核心技术深度解析：疑难杂症与深入理解
Java 疑难杂症笔记涵盖了Java编程中的诸多关键知识点，包括Jdk、Jre、Jvm的区别以及它们在Java开发过程中的作用。Jdk（Java Development Kit）是开发工具包，包含了编译器和标准库，用于编写Java源代码；Jre（Java ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值