如何與一個輸出

所以分別彙總多個目錄中，我有一個目錄：如何與一個輸出

mods/ 
-core/ 
--index.js 
--scripts/ 
---lots of stuff imported by core/index

如果要彙總到例如mods/core/index.min.js

但是我有很多的這個作品具有典型的彙總方式這些mods/**/目錄，我想利用它們彙總成iifes的事實。每個mods/**/index.js的意志，而不是export，分配到我們推測提供了一個全局變量：

mods/core/index.js

import ui from './scripts/ui/' 
global.ui = ui

mods/someMod/scripts/moddedClass.js

export default class moddedClass extends global.ui.something { /* some functionality extension */}

mods/someMod/index.js

import moddedClass from './scripts/moddedClass' 
global.ui.something = moddedClass

所以希望你可以看到每個MOD目錄可以以典型的方式來rollup'd但是，我需要再放入實際iifes內另一個讓：

mods/compiled.js

(function compiled() { 
    const global = {}; 

    (function core() { 
    //typical rollup iife 
    })(); 

    (function someMod() { 
    //typical rollup iife 
    })(); 

    //a footer like return global or global.init() 
})();

爲此任何幫助將不勝感激。我想最簡單的答案就是我可以簡單地爲每個mod的iife獲取一個字符串值，而不是彙總寫入文件。

在這一點上，我可以迭代/mods/目錄，按某些modlist.json或某事指定的順序，然後調用每個/mod/index.js彙總，然後從字符串自己構建外部iife。

但是，我想這不會是一個完整的解決方案sourcemapping？或者可以包含多個內聯源地圖？考慮到源映射，我想知道是否需要另一個構建步驟，每個模塊在這個系統甚至到達之前都會被轉發。

來源

2017-05-28 Danie Clawson

使用rollup的bundle.generate api生成多個iif並使用fs.appendFile將它們寫入到一個文件中。

對於您可以使用此模塊sourcemaps（從彙總的同一作者的）https://github.com/rich-harris/sorcery

來源

2017-05-29 04:32:29

嘿感謝你這一點，至少在正確的方向邁出的一步。雖然你認爲你可以解釋它，好像我是一個白癡嗎？一些基本的代碼示例可能？我只是有一些麻煩把整個圖片放在一起 –

@DanieClawson我認爲rollup的wiki是一個很好的開始，https://github.com/rollup/rollup/wiki/JavaScript-API，你可以參考代碼示例維基，如果你有正確的方向，代碼很簡單。 –

那麼現在彙總結束是非常明確的，是的。我被困在理解我需要給魔法的東西上，以便得到正確的最終輸出。具體來說，巫術說它遵循源圖的「鏈」回到根。問題在於，這對我來說意味着我必須創建一個來自單個mod iifes的源代碼映射 - >以某種方式來說。 –

好了，所以我結束瞭解決這個問題的方法是使用source-map-concat

，它基本上是我所描述的，正確的盒子外面。我必須做的唯一事情就是異步在將結果傳遞給source-map-concat之前迭代mod目錄並彙總每個mod，因爲rollup.rollup返回一個Promise。

我也最終想要在線源代碼，以便代碼可以直接注入，而不是寫入文件，所以我用convert-source-map。

剩下要解決的唯一問題是子源映射。如果我正在生成文件，巫術會很好，但我想保留它作爲字符串來源。現在至少它會告訴我一個錯誤來自哪個mod，但不是它來自的子文件。如果任何人有關於如何對字符串進行巫術風格操作的信息，請告訴我。

下面是我的文件相關的最終代碼：

const rollup = require("rollup") 
const concat = require("source-map-concat") 
const convert = require("convert-source-map") 

const fs = require("fs") 
const path = require("path") 

const modsPath = path.join(__dirname, "mods") 

const getNames = _ => JSON.parse(fs.readFileSync(path.join(modsPath, "loadList.json"), "utf8")) 

const wrap = (node, mod) => { 
    node.prepend("\n// File: " + mod.source + "\n") 
} 

const rolls = {} 
const bundles = {} 

const rollupMod = (modName, after) => { 
    let dir = path.join(modsPath, modName), 
     file = path.join(dir, "index.js") 

    rollup.rollup({ 
    entry: file, 
    external: "G", 
    plugins: [] 
    }).then(bundle => { 
    rolls[modName] = bundle.generate({ 
     format: "iife", 
     moduleName: modName, 
     exports: "none", 
     useStrict: false, 
     sourceMap: true 
    }) 

    after() 
    }) 
} 

const rollupMods = after => { 
    let names = getNames(), i = 0, 
     rollNext = _ => rollupMod(names[i++], _ => i < names.length - 1? rollNext() : after()) 

    rollNext() 
} 

const bundleCode = after => { 
    rollupMods(_ => { 
    let mods = concat(getNames().map(modName => { 
     let mod = rolls[modName] 

     return { 
     source: path.join(modsPath, modName), 
     code: mod.code, 
     map: mod.map 
     } 
    }), { 
     delimiter: "\n", 
     process: wrap 
    }) 

    mods.prepend("(function(){\n") 
    mods.add("\n})();") 

    let result = mods.toStringWithSourceMap({ 
     file: path.basename('.') 
    }) 

    bundles.code = result.code + "\n" + convert.fromObject(result.map).toComment() 

    after(bundles.code) 
    }) 
} 

exports.bundleCode = bundleCode

來源

2017-05-30 22:18:16

如何與一個輸出

回答

相關問題