将单个浏览器 js 代码解绑到原始文件中答案

【问题标题】：debundle single browser js code into original files将单个浏览器 js 代码解绑到原始文件中
【发布时间】：2016-11-14 14:17:25
【问题描述】：

我有一个结构如下的js文件：

define("example/example", ["exports", "example/something", "example/other", "ex/sthg"], function(e, t, n, a, r) {
    e["default"] = {something: 'example'}

}), define("examle/module", ["exports"], function(e) {
    ///
}), define("examle/module2", ["exports"], function(e) {
    // and so on...
}), require("example/sthg")["default"].callSomething({
    //
});

我正在寻找一种方法将此文件解压缩为原始文件，例如 example/example.js、example/module、example/module2 等。

我尝试了browser-unpack，但没有任何效果，所以我认为它没有与browserify 捆绑在一起。语法类似于AMD 或RequireJS。

有什么办法可以解包这样的文件吗？

【问题讨论】：

我对此表示怀疑。任何 unbundle 脚本如何知道一个文件在哪里结束，另一个文件从哪里开始？

标签： javascript requirejs webpack amd commonjs

【解决方案1】：

快速猴子解决方案，这对我很有帮助 - 它使用导入列表和 function(e, t, n... 创建模块树作为文件内容。也许它对某人有用。就我而言，它可以完全解绑（当然只针对 js，而不是 jsx），但我不想玩 js 解析器。

var fs = require('fs');
var path = require('path');
var mkdirp = require('mkdirp');

const defineArgs = ['e', 't', 'n', 'a', 'r']
function parseFunction(func, deps) {
    let funcStr = func.toString(),
        depsArr = [],
        depsStr = ''

    // just to know what etnar is
    for(let i in deps) {
        if(deps[i]!='exports') {
            depsArr.push('const ' + defineArgs[i] + ' = require("' + deps[i] + '")')
        }
    }

    depsStr = depsArr.join('\n')

    return depsStr + '\n' + funcStr
}
// override define
var define = function(filename, deps, func) {
    console.log(filename + ': ' + deps)
    let outPath = 'src/' + filename + '.js',
        outDir = path.dirname(outPath),
        out = parseFunction(func, deps)

    try {
        fs.lstatSync(outDir)
    } catch (e) {
        mkdirp(outDir, function(err) { if(err){console.error(err)} })
    }

    fs.writeFile(outPath, out, function(err) {
        if(err){console.error(err)}
    })
}
// paste your script below and run this via node
// define("example/example", ["exports", "example/something", .......

【讨论】：