2

我构建了一个在浏览器中运行的小型 ReactJS 应用程序,我遇到了旧浏览器版本(尤其是在 iOS 设备上)的问题,该应用程序是使用 node 和 browserify/babelify 构建的

我有以下 gulpfile 设置:

gulp.task('build', function () { return browserify({entries: './src/app.jsx', extensions: ['.jsx'], debug: true}) .transform(babelify) .bundle() .pipe(source('app.js')) .pipe(buffer()) .pipe(minify()) .pipe(gulp.dest('public/layout/lib')) })

使用以下配置:

{ "presets": ["env"], "plugins": ["transform-react-jsx"], }

我的一个反应组件导入一个模块,如下所示:

import ethereum_address from 'ethereum-address'

该代码有效,但由于某种原因,bablified 包仍然具有来自该特定模块的use strict一些声明。let

我能做些什么来强制 babelify 根据需要实际替换这些声明,以便这段代码可以在旧版浏览器上运行?

4

1 回答 1

0

在四处挖掘并看到 Elin Gersin 发现了什么之后,我现在明白了这个问题。

似乎在转换时需要指定global属性,以便转换器知道在所有导入上运行,而不仅仅是在反应组件上运行。

生成的 gulp 任务如下所示:

gulp.task('build', ['sass'], function () { return browserify({entries: './src/app.jsx', debug: true}) .transform(babelify, { global: true, only: /^(?:.*\/node_modules\/ethereum-address\/|(?!.*\/node_modules\/)).*$/ }) .bundle() .pipe(source('app.js')) .pipe(buffer()) .pipe(minify()) .pipe(gulp.dest('public/layout/lib')) })

于 2017-12-14T13:37:45.067 回答