- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
我正在尝试使用 browserify 和 babelify 创建 gulp 任务。这是任务:
var gulp = require('gulp');
var browserify = require('gulp-browserify');
var source = require('vinyl-source-stream');
var babelify = require('babelify');
gulp.task('js', function () {
browserify('./resources/js/*.js')
.transform(babelify)
.bundle()
.pipe(source('*.js'))
.pipe(gulp.dest('./public/js'));
});
我找到了一些示例代码,尝试使用它们,但结果总是一样。
当我运行任务并保存我的 example.js 文件时,出现以下错误:
TypeError: browserify(...).transform 不是函数
我做错了什么?
最佳答案
您正在混淆 browserify
和 gulp-browserify
的 API。
来自gulp-browserify docs ,你会想做这样的事情:
var gulp = require('gulp')
var browserify = require('gulp-browserify')
gulp.task('js', function () {
gulp.src('./resources/js/*.js')
.pipe(browserify({
transform: ['babelify'],
}))
.pipe(gulp.dest('./public/js'))
});
编辑:自从第一次回答这个问题后,gulp-browserify has been abandoned gulp 已经有了很大的发展。如果您想使用较新版本的 gulp 实现相同的目的,您可以 follow the guides provided by the gulp team .
您最终会得到如下内容:
var browserify = require('browserify');
var babelify = require('babelify');
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var sourcemaps = require('gulp-sourcemaps');
var util = require('gulp-util');
gulp.task('default', function () {
var b = browserify({
entries: './resources/test.js',
debug: true,
transform: [babelify.configure({
presets: ['es2015']
})]
});
return b.bundle()
.pipe(source('./resources/test.js'))
.pipe(buffer())
.pipe(sourcemaps.init({ loadMaps: true }))
// Add other gulp transformations (eg. uglify) to the pipeline here.
.on('error', util.log)
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./public/js/'));
});
关于javascript - Gulp + babelify + browserify 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33187695/
我正在写一个React申请 ES6和 JSX 。以下是我用来将 .es6 文件浏览器化为 bundle.js 的命令。 $ browserify src/es6/app.es6 -t babelify
我正在进行我的个人项目,我想集成 flowtype。现在,在 package.json 中我得到了: "babel-plugin-syntax-flow": "6.3.13" 这有助于 babelif
全新安装 browserify 后,以下内容对我不起作用: browserify main.js -o bundle.js -t babelify main.js的内容是: var x = () =>
如何使用 babel在不同的目录中转译包含 ES6 内容的 JavaScript 文件?我希望结果位于相同的目录中(例如,具有 foo/bar/index.js,我希望通过覆盖在同一个文件中获取 ES
我正在使用 babel 来转译我的 es6 代码。我还使用 gulp 来完成任务。我的 gulpfile.js 如下所示: var gulp = require('gulp'), es6Pat
我有多个使用 es2015 特性编写的模块。我不想将 es2015 转换作为每个模块的依赖项,而是在全局安装它。它失败了 错误:找不到相对于目录的预设“es2015” 有人试过吗?任何解决方法? 最佳
我目前正在学习如何使用 npm、Babel 和 Browserify 设置 React 项目。 Babel 的用法对我来说似乎很清楚:它将 JSX 和 ES6 代码转换为 ES5 代码,可以在所有浏览
我是: 与 browserify 捆绑 使用 babel 将 ES6 转换为 ES5 使用 uglifyjs 压缩 ES5 以前有效。然而最近我一直收到 uglifyjs 的错误,提示 ES6 语法,
我正在使用实现 Browserify-Rails 的 Rails 4.0 项目实现Babelify . 在我的本地和远程 Beta 服务器上,一切似乎都很顺利。但是当我部署到生产环境时,某些文件将被跳
有没有办法import使用 Babelify 时的原生 Node 模块(例如 crypto、fs、path)与 Browserify ? 例如: 'use strict'; import $ from
我正在尝试将我的工作应用程序从 React 和 Gulp with ES5 转换为 React + Gulp 和 ES6。 我只尝试用 babelify 替换 Reactify,但仍然收到 gulp
我正在尝试使用 browserify 和 babelify 创建 gulp 任务。这是任务: var gulp = require('gulp'); var browserify = require(
我在我的应用程序中使用 es6 模块,在我的 chrome 检查器中调试时遇到问题。当我在我的代码中执行类似以下操作时: import 'widget' from './widget' class S
我正在使用 Gulp , Browserify和 Babelify将我的源代码从 ES6 + JSX 编译为纯 Javascript。 我的 gulpfile.js 看起来像: var gulp =
这是我的 gulpfile 代码: gulp.task('react', function () { browserify('app/src/main.jsx') .transform(r
我正在尝试使用 Babelify 来转译 async 和 wait ES7 功能,但我不希望使用 gulp、grunt 或类似的构建工具。到目前为止,我仅使用 npm 就取得了巨大的成功,而这一额外步
我使用带有 Gulp 系统的 Browserify 构建器从 reactify JSX 编译器转移到 Babel 编译器 (Babelify)。现在我得到了这个错误: [00:17:25] Error
watchify配合babelify使用实用吗? 我正在尝试 React 并在开发模式下运行一个项目: watchify app/src/src.js -t babelify -o app/build
有没有办法通过 Browserify 和 Babelify 使用 ES2015 进行动态继承? 我需要用额外的功能“构造函数”包装一个类“前驱”,并且我不知道前驱将是什么,所以我不知道参数的数量或有关
我想对我的代码进行 browserify、tsify 和 babelify。 Browserify 和其他转译器之一可以工作,但它们不能一起工作。 Babel 似乎只是被忽略了(甚至不读 .babel
我是一名优秀的程序员,十分优秀!