webpack输出的文件也和Babel一样是有解决兼容性问题的是吗

webpack输出的文件也和Babel一样是有解决兼容性问题的是吗

问题描述:

老师,我想问下webpack输出的文件也和Babel一样是有解决兼容性问题的是吗?就和babel一样将源生写的ES6代码转ES5或以下的

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

3回答
好帮手慕夭夭 2021-01-13 13:33:33

同学你好,问题解答如下:

1、老师测试一下,确实没有babel也可以编译import和export。本质上,webpack是静态模块打包工具,也就是同学理解的把多个模块打包到一起。

2、因为浏览器不支持import和export,如果不编译import和export,会造成报错程序无法运行,所以webpack就把它编译了来避免程序无法运行,这个应该是比较特殊的。你可以理解为为webpack会编译一些内容,至于具体还会编译什么,就是比较底层原理了,这个我们一般没有深究过。之前老师说的不严谨,给同学造成疑惑很抱歉。在没有babel的情况下,为了避免程序报错,webpack也编译了import和export。但是webpack的主要工作还是打包,要去编译es6代码,还是要使用babel插件的。

祝学习愉快~


好帮手慕夭夭 2021-01-13 09:49:14

同学你好,“比如webpack输出的文件把import,export这些去掉,主要不是怕别的浏览器不支持这些语义?”理解的不对,这些并不是webpack做的,webpack自身没有编译代码的功能import,export是es6语法,部分浏览器不支持es6语法,所以需要把es6语法编译成之前的js语法,这些工作就是babel插件去做的。目前来说,也只有es6代码需要进行编译,把它转换为之前的语法让浏览器兼容性更好。

重新理解一下哦,这些是babel插件去做的,并不是webpack,webpack并没有这样的功能。

祝学习愉快~

  • 提问者 好帮手慕斯林 #1

    噢噢,那我对webpack的理解不够深了,那课件中对webpack的解释是一个静态打包器,当webpack在处理程序时,会将所有的模块打包成一个或多个文件。我那可以理解为webpack主要是将模块打包到一起而已是吗?这我第一个问题。


    然后是,结合老师你的解答webpack是没有编译功能的,那课件视频中,如下图

    http://img1.sycdn.imooc.com//climg/5ffe5ab209bbb01111790882.jpg

    为啥entry输入的es6代码就只有一行,而经过webpack输出后就编译成一长串了?这不是编译过了吗?输出后import,export也是不见了的,那这不仅仅是打包模块而已吧?

    2021-01-13 10:33:35
  • 提问者 好帮手慕斯林 #2

    还有就是老师你刚说的webpack输出的文件把import,export这些去掉,这些并不是webpack做的,那是谁做的?webpack初体验这节课中只用了webpack功能并没有安装和用到babel插件呢

    http://img1.sycdn.imooc.com//climg/5ffe5dc5099e2ea411020462.jpg

    2021-01-13 10:41:14
好帮手慕夭夭 2021-01-12 17:29:46

同学你好,输出文件是在打包项目时,把项目中的代码打包到输出文件的。例如我们项目中写的es6代码,当打包项目的时候,会编译成es5,那么编译好的es5就会放在输出文件中。所以输出文件没有什么兼容性可言,只是指定了项目打包之后要存在哪个文件。而babel是一个插件,我们安装了这个插件,这样就可以使用它编译es6代码了。这里重新理解一下。

祝学习愉快~

  • 提问者 好帮手慕斯林 #1

    你理解错我意思了,比如webpack输出的文件把import,export这些去掉,主要不是怕别的浏览器不支持这些语义?这样可以兼容更多的浏览器,还有babel编译成es5不也这个目的?还是说有别的目的吗?

    2021-01-13 09:08:48
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师