gulp browserify 定义一个js为指定入口？压缩后js文件顺序不是按引入顺序？

Question

gulp browserify 定义一个js为指定入口？压缩后js文件顺序不是按引入顺序？
main.js是入口文件，里面引入了

import { A } from './A';import "./B";

现在B中使用了A定义的方法，但是一直提示这个方法XXXX is not defined?应该怎么修改？

A文件是

export function A() {    console.log("AAAAAAA");}

B 文件是

A();

gulp 压缩后的文件是

!function u(i,f,c){function s(e,r){if(!f[e]){if(!i[e]){var t="function"==typeof require&&require;if(!r&&t)return t(e,!0);if(A)return A(e,!0);var n=new Error("Cannot find module '"+e+"'");throw n.code="MODULE_NOT_FOUND",n}var o=f[e]={exports:{}};i[e][0].call(o.exports,function(r){return s(i[e][1][r]||r)},o,o.exports,u,i,f,c)}return f[e].exports}for(var A="function"==typeof require&&require,r=0;r<c.length;r++)s(c[r]);return s}({1:[function(r,e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.A=function(){console.log("AAAAAAA")}},{}],2:[function(r,e,t){"use strict";A()},{}],3:[function(r,e,t){"use strict";r("./A");r("./B")},{"./A":1,"./B":2}]},{},[3]);

报错提示 A is not defined

这个是配置文件

const gulp = require('gulp');//引入gulp  const htmlMin = require('gulp-htmlmin');//引入html压缩模块  const autoprefixer = require('gulp-autoprefixer');const cleanCss = require('gulp-clean-css') //引入css压缩模块const browserify = require('browserify');const babelify = require('babelify');const source = require('vinyl-source-stream');const buffer = require('vinyl-buffer');const babel = require('gulp-babel'), //引入es6转es5模块    uglify = require('gulp-uglify') //引入js压缩模块const connect = require('gulp-connect');const webserver = require('gulp-webserver');const proxy = require('http-proxy-middleware');const sass = require('gulp-sass')(require('sass'));const path = {    html: {        src: 'src/**/*.html',        dest: 'dist'    },    css: {        src: 'src/**/*.css',        dest: 'dist'    },    js: {        entries: 'src/assets/js/main.js',        output: './assets/js/main.js',        src: 'src/**/*.js',        dest: 'dist'    },    scss: {        src: 'src/**/*.scss',        dest: 'dist'    }}/**  * 创建任务，并命名任务名 * 一个*表示所有文件，两个*表示所有目录 */const htmlCompress = () => {    return gulp.src(path.html.src)        .pipe(htmlMin({            removeComments: true,//清除HTML注释            collapseWhitespace: true,//压缩HTML            collapseBooleanAttributes: true,//压缩布尔属性的值            removeEmptyAttributes: true,//删除所有空格作属性值            removeScriptTypeAttributes: false,//删除<script>的type="text/javascript"            removeStyleLinkTypeAttributes: true,//删除<style>和<link>的type="text/css"              minifyJS: true,//压缩页面JS            minifyCSS: true //压缩页面css        })).pipe(gulp.dest(path.html.dest)) //指定压缩文件放置的目录 }const scssCompile = () => {    return gulp.src(path.scss.src)        .pipe(sass().on('error', sass.logError))        .pipe(gulp.dest(path.scss.dest));}const cssCompress = () => {    return gulp.src(path.css.src)        .pipe(autoprefixer({            cascade: false        }))        .pipe(cleanCss())        .pipe(gulp.dest(path.css.dest))}const jsCompress = () => {    // return gulp.src(path.js.src)    //     .pipe(babel({    //         presets: ['@babel/env'] //es6转es5    //     }))    //     .pipe(uglify()) //执行压缩    //     .pipe(gulp.dest(path.js.dest))    return browserify({        entries: path.js.entries, // 入口文件路径        debug: true    })        .transform(babelify, {            presets: ['@babel/preset-env']        })        .bundle()        .pipe(source(path.js.output))        .pipe(buffer())        .pipe(uglify())        .pipe(gulp.dest(path.js.dest));}const watch = () => {//监听文件，文件改变执行对应的任务    gulp.watch(path.html.src, htmlCompress)    gulp.watch(path.scss.src, scssCompile)    gulp.watch(path.html.src, cssCompress)    gulp.watch(path.js.src, jsCompress)}// const server = () => {//     // 创建服务器//     connect.server({//         root: 'dist',//根目录//         port: '2000',//端口号  //         livereload: true //服务器热更新//     })// }const createServer = () => {    return gulp.src('./dist')        .pipe(webserver({ //创建服务器            port: '3000', //端口号            host: '172.16.108.106',            open: '/dark-rankings.html', //默认打开路径            livereload: true, //热更新            middleware: [                proxy.createProxyMiddleware('/api', { //创建反向代理，请求已 /api 开头就使用target的服务器                    target: 'http://172.16.108.106',                    changeOrigin: true                })            ]        })).pipe(connect.reload())}/* 以对象形式导出 *//* 同时运行多个任务 */module.exports.default = gulp.series(gulp.parallel(htmlCompress, scssCompile, cssCompress, jsCompress, watch, createServer));

Answer 1

你的A模块里，你这样导出你的方法：

export function yourMethod() {  // your code here}

然后在你的B模块里导入这个方法：

// B.jsimport { yourMethod } from './A';