javascript - gulp怎么打包js中的import语法
ringa_lee
ringa_lee 2017-04-11 12:53:55
[JavaScript讨论组]

我的gulp配置文件基础是这样的。

const gulp = require('gulp'),
      babel = require('gulp-babel'),
      ugify = require('gulp-uglify')

gulp.task('watch', function () {
  gulp.watch('app.js', ['a'])
})

gulp.task('a', () =>
  gulp.src('app.js')
      .pipe(babel({
        presets: ['es2015']
      }))
      .pipe(ugify())
      .pipe(gulp.dest('dist'))
)

然后我的app.js中用了es6的module语法

import { bar } from './index.js'

var foo = () => {
  console.log(bar)
}

foo()

index.js如下

export const bar = 'aaaaaaaaaaaa'

打包后的js如下,但是这样并不能在浏览器端运行。

"use strict";var _index=require("./index.js"),foo=function(){console.log(_index.bar)};foo();

所以,应该怎么修改呢。

ringa_lee
ringa_lee

ringa_lee

全部回复(4)
PHPz

babel只能转化,不能打包,你还需要使用browserify这个插件

高洛峰

gulp不是模块化开发工具,不能把你需要的资源打包。

阿神

import的支持需要增加plugin。 https://babeljs.io/docs/plugins/

巴扎黑

你应该想实现的是app.js 和index.js 打入一个包中吧?

gulp.src(['app.js','index.js'])

    .pipe(uglify())
    .pipe(concat('lib.min.js'))
    .pipe(gulp.dest('build/js/'))
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号