解决webpack和gulp打包js时ES6转译ES5时Object.assign()方法没转译成功的问题

最新推荐文章于 2023-04-14 16:11:24 发布
最新推荐文章于 2023-04-14 16:11:24 发布
阅读量359 收藏
点赞数
文章标签： webpack javascript json ViewUI
原文链接：http://www.cnblogs.com/bobo1/p/11170200.html
版权

在webpack或gulp打包的配置文件中package.json

引入"@babel/plugin-transform-object-assign": "^7.2.0",

然后执行npm install

然后就开始下载这个工具包了，下好后就该改一下配置文件了

webpack中的.babelrc文件里这样写

 

gulp里的gulpfile.js文件中这样写

 

这样就可以把Object.assign()方法成功转译，下面对比看一下转译前后的js样例

 

转载于:https://www.cnblogs.com/bobo1/p/11170200.html

weixin_30752377
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript 复制对象与Object.assign方法无法实现深复制
12-12
在JavaScript这门语言中，数据类型分为两大类：基本数据类型和复杂数据类型。基本数据类型包括Number、Boolean、String、Null、String、Symbol（ES6 新增），而复杂数据类型包括Object，而所有其他引用类型（Array、Date、RegExp、Function、基本包装类型（Boolean、String、Number）、Math等）都是Object类型的实例对象，因此都可以继承Object原型对象的一些属性和方法。 而对于基本数据类型来说，复制一个变量值，本质上就是copy了这个变量。一个变量值的修改，不会影响到另外一个变量。看一个简单的例子。 le
gulp-jstransform：Gulp插件将ES6转换为ES5
02-03
Gulp 用法 var jstransform = require ( 'gulp-jstransform' ) ; gulp . task ( 'jstransform' , function ( ) { gulp . src ( './src/*.js' ) . pipe ( jstransform ( ) . on ( 'error' , gutil . log ) ) . pipe ( gulp . dest ( './public/' ) ) } ) ;
关于babel 的一些包理解7.X版本
热门推荐
weixiaoderensheng的博客
10-10 1万+
Babel 组成部分 @babel/core  *必装 babel 核心包，编译器。提供转换的API @babel/cli  babel的命令行工具，通过命令行对js代码进行转译 具体命令使用：https://babeljs.io/docs/en/babel-cli  启动babel/cli 编译器  /node_modules/.bin/babel 非全局安装 将src 目...
记一次webpack4.x打包兼容ie8 的经历
weixin_30725467的博客
08-15 4856
记一次webpack4.x打包兼容ie8 的经历 写在前面 打包经历中没有用到Promise等语法，只用到了es6的一些语法书写逻辑 webpack使用的是4.x ; babel 使用的是7.x 不一定适用于所有要兼容ie 8 的场景，请注意 背景： 因为公司功能项目需要，领导我书写了一个javaScript的程序，目的是暴露3个方法，能够调用相关的后台逻辑代码； 经历： 要求定下来了，那...
常见的Webpack Babel用来解析ES6语法的插件
fuweihan00的博客
04-14 541
7. @babel/plugin-transform-regenerator：用于将使用async/await关键字的异步函数转换为ES5的生成器函数。4. @babel/plugin-transform-template-literals：用于将模板字面量转换为普通字符串拼接。1. @babel/plugin-transform-arrow-functions：用于将箭头函数转换为普通函数。6. @babel/plugin-transform-object-assign：用于将对象的扩展运算符转换为。
前端应该掌握的编译基础（基于 babel）
奇舞周刊
08-25 520
开发息息相关虽然 Babel 团队在各种哭穷，但是 Babel 始终是我们前端在开发中不可或缺的重要工具。 虽然我们只是 API 调用工，但是多了解一些总是会有好处的嘛 ☄️☄️☄️什么是...
webpack的坑——Object.assign
gwm4230670的博客
02-16 4038
先说说Object.assign，该方法是ES6中合并对象用的。 chrome，firefox等浏览器是支持该方法的，但是一些低版本的浏览器并不支持该方法。今天用webpack出现这样的问题，打包后的程序在pc上的高版本浏览器上没有问题，但是再一些低版本的浏览器。和手机浏览器上报错 undefined is not a function。没错问题就出在这个Object.assign上。当前版本的
利用babel工具将es6语法转换成es5，Object.assign方法报错
weixin_30545285的博客
09-10 356
一、新建工程初始化项目 　　1.新建工程文件夹这里起名叫做es6,然后在里面创建两个文件夹分别为src 、dist如下图：(src为待转换es6 js存放目录，dist为编译完成后的es5 js存放目录) 2、在src目录下新建一个js文件，里面输入es6的代码 3. 初始化项目 　　npm init 二、全局安装babel工具 1）在终...
gulp-jsdc:es6 到 es5 的 gulp 插件
06-18
jsdc 编译 es6 到 es5 用法 var gJsdc = require ( 'gulp-jsdc' ) ; gulp . task ( 'jsdc' , function ( ) { gulp . src ( '**/*.js' ) . pipe ( gJsdc ( ) ) . pipe ( gulp . dest ( 'dist' ) ) } ) ; 选项 ...
使用webpack将ES6转化ES5的实现方法
10-16
主要介绍了使用webpack将ES6转化ES5的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
webpack-es6-sass:用于转译ES6和Sass的Webpack 4模板
05-13
Webpack 4：ES6 + Sass模板该Webpack配置将ES6 Javascript编译/转换为ES5，同时还将Sass编译为CSS。入门克隆此仓库： git clone https://github.com/0pixels/es6-sass-template.git 运行cd es6-sass-template/ 运行...
webpack打包基础知识点与es6知识点.xmind
11-12
webpack打包基础知识点,各种插件和加载器，方便了webpack打包，es6的重要知识点总结，加油。
babel object.assign的用法
weixin_38167855的博客
12-12 281
object.assign是用来合并对象的！ 用法： 1，先安装 npm install --save-dev babel-plugin-transform-object-assign2， In Object.assign(a, b);//a，代表传入的对象，b，带便对象 COPY Out var _extends = ...; _extends(a, ...
webpack+react环境搭建，不必要再使用create-react-app来创建，随意配置更方便
weixin_30632899的博客
08-13 331
首先是配置文件package.json，里边包括所用到的babel以及关于react的一些依赖包。 { "name": "service", "version": "0.1.0", "private": true, "dependencies": { "@antv/g6": "^1.2.1", "@babel/core": "^7.2.0...
ES6 + Webpack + React + Babel 如何在低版本浏览器上愉快的玩耍（下）
weixin_33895695的博客
09-18 524
回顾 起因： 某天，某测试说：“这个页面在 IE8 下白屏，9也白。。”某前端开发: 吭哧吭哧。。。一上午的时间就过去了，搞定了。第二天，某测试说：“IE 又白了。。”某前端开发: 嘿咻嘿咻。。。谁用的 Object.assign，出来我保证削不屎你。 在上篇，我们主要抛出了两个问题，并给出了第一个问题的解决方案。 SCRIPT5007...
babel实践：真实gulp项目支持ES6转译ES5的跳坑指北
一期一会的博客
01-11 2951
这两天，在对现有项目进行框架优化，由于项目使用gulp+jQuery构建的，不支持ES6规范，不能很好满足越来越复杂的需求场景，尤其是需要多异步任务的情况下，js又要异步又要操作各种DOM状态，状态与状态间也是各种紧耦合，单纯使用es5和jQuery，已经开始影响开发效率了。 虽然通过相关设计模式的使用，一定程度上减轻了js逻辑处理的复杂度，但看着有更佳实践的ES6语法不能用而只能白流口水，实在是...
webpack打包ES6降级ES5
最新发布
06-01
Babel 是一个转译器，可以将 ES6 代码转化为 ES5 代码，而 webpack 则是一个打包工具，可以将转译后的代码打包成一个或多个文件。 以下是使用 webpack 打包 ES6 代码的步骤： 1. 安装 Babel 和相关插件 ``` npm ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值