请问关于webpack babel 怎么将Object.assign() 转成es5语法 ?

webpack babel 怎么将Object.assign() 转成es5语法 


呼唤远方
浏览 449回答 4
4回答

偶然的你

习惯了WebStorm的话..我就假设题主会用Node.js和npm啦~一句话总结:用WebStorm自带的File Watcher功能+Babel实现自动转换ECMAScript 6代码为ES5代码我是这么配置的..就先新建一个Empty Project,然后在src目录下新建了一个main.js;// 这一步不是必须的 只是刚上手的话 从空项目开始自己配置会少很多干扰Then..进入设置,把JavaScript language version改成ECMAScript 6;再Then..写一段ES6代码'use strict';// node直接运行ES6代码时,如使用了ES6的一些关键字,比如let,就需要严格模式,否则会报错// 这是没有严格模式时候的错误提示// SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict modefunction* fibs() {// Generator Functionlet a = 0;let b = 1;while (true) {yield a;// [a, b] = [b, a + b];b = a + b;a = b - a;}}let [first, second, third, fourth, fifth, sixth] = fibs();console.log(first, second, third, fourth, fifth, sixth);现在IDE会出现一个File watcher提示条先别点Add watcher!我们要先去装babel~首先在根目录新建一个package.json{"name": "test-project","version": "1.0.0"}然后打开IDE的Terminal,安装babel-clinpm install --save-dev babel-cliGood! 现在可以去点Add watcher啦,点完之后会弹出一个框,其中大部分设置IDE都帮你搞定了下面第三行,Program那一项,填$ProjectFileDir$/node_modules/.bin/babel然后点OK,这个时候你就会发现左边多出来一个main-compiled.js文件啦但是还没搞定!现在只是搞定了自动转换的功能,系统默认把ES6 compile成了ES6..(你应该会发现compile出来的东西跟原来的一样..Generator函数并没有被转换成ES5的格式)所以我们需要安装Babel的preset以正确识别ES6代码;和刚才一样,在npm安装babel的ES6的presetnpm install --save-dev babel-preset-es2015在根目录下新建一个.babelrc文件(就是babel在当前项目的配置文件),写上{"presets": ["es2015"]}OK搞定!保存再回去看一下main-compiled.js 应该就变成这个样子啦,现在你在main.js里直接写ES6代码,IDE都会自动compile成ES5的代码在这里啦~注意:想直接用Node.js运行ES6代码还是有些问题..因为这段代码用的ES6的解构赋值Node.js还未完全支持,需要在运行的时候加入一些tags(以开启Node.js的相关试验特性),具体可以参考Node.js官网对ES6的说明:ECMAScript 2015 (ES6)。

蓝山帝景

如果你问的是require或者import用法,那目前仍然需要通过babel或者traceur之类的转义工具将之转义为ES5语法,才能在浏览器里运行。但对于lodash库本身,并不是非得利用webpack...之类的工具才能用,直接使用<script>标签放在html里,就可以使用_了。

慕的地6264312

Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)都不会转码。而且像import和export这两个命令现在在任何浏览器中都是不支持的, 同时babel也无法将其转换为浏览器支持的ES5, 原因在于:babel只是个翻译,假设a.js 里 import 了 b.js, 对a.js进行转码,只是翻译了a.js,并不会把b.js的内容给读取合并进来, 如果想在最终的某一个js里,包含 a.js,b.js 的代码,那就需要用到打包工具所以我在这里讲解一下如何使用webpack工具将带有import和export语法的JS文件, 通过打包工具生成所有浏览器都支持的单个JS文件.1. 下载node.js和webpackNode.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。可以说就是服务器端的JS. webpack是一个打包工具, 而它是依赖于node.js运行的.
打开App,查看更多内容
随时随地看视频慕课网APP