如何將文件注入到systemjs-builder中以捆綁角4.0.0應用程序？

我想捆綁角4.0.0應用程序。如何將文件注入到systemjs-builder中以捆綁角4.0.0應用程序？

我試過browserify，但是新的角度加載器插件（它允許不需要templateUrl中的moduleId）不會被調用，所以模板最終會出現錯誤的路徑。

所以我搬到了systemjs-builder，但問題是，當它運行該插件時，它崩潰，說文檔沒有定義。

有沒有辦法將文件注入構建器？

或者我做錯了什麼？

這是我正在測試的簡單生成器（systemjs-config是角速啓動器）。

var path = require("path"); 
var Builder = require('systemjs-builder'); 

var builder = new Builder('src/frontend', 'src/frontend/systemjs.config.js'); 

builder .bundle('main.js', 'bundle.js') 
.then(function() { 
    console.log('Build complete'); 
}) 
.catch(function(err) { 
    console.log('Build error'); 
    console.log(err); 
});

來源

2017-04-16 Ricardo Gomes

我一直在使用這種https://github.com/laxa1986/gulp-angular-embed-templates用'gulp'。另外，看看http://stackoverflow.com/questions/35867660/build-angular2-html-and-typescript-to-a-single-file/35868706#35868706 – martin

謝謝@馬丁，我試圖得到遠離吞噬，並使用npm來完成所有的工具，以儘量減少依賴（我厭倦了我的packages.json長達一英里），但我會看看回購。我可能能夠將它融入到systemjs構建器中。儘管如此，對於任何來到這裏的人來說，我覺得這很奇怪，我們無法做到這一點，只有systemjs構建者，一定有辦法，如果有人有想法，我會非常感激。 –

這是殺了我，我似乎無法找到解決方案。我發現很難相信我們是唯一一個試圖建立一個只是工作的systemjs構建:( – Tamas

我一直在長時間尋找解決這個問題的方法。由於我找不到它，我修改了systemjs-angular-loader.js以繞過錯誤。有了這個hack systemjs-builder現在正在工作。

var templateUrlRegex = /templateUrl\s*:(\s*['"`](.*?)['"`]\s*)/gm; 
 
var stylesRegex = /styleUrls *:(\s*\[[^\]]*?\])/g; 
 
var stringRegex = /(['`"])((?:[^\\]\\\1|.)*?)\1/g; 
 

 
module.exports.translate = function(load){ 
 
    if (load.source.indexOf('moduleId') != -1) return load; 
 

 
    var document=document || null; 
 
    if(document){ 
 
    var url = document.createElement('a'); 
 
    url.href = load.address; 
 

 
    var basePathParts = url.pathname.split('/'); 
 

 
    basePathParts.pop(); 
 
    var basePath = basePathParts.join('/'); 
 

 
    var baseHref = document.createElement('a'); 
 
    baseHref.href = this.baseURL; 
 
    baseHref = baseHref.pathname; 
 

 
    if (!baseHref.startsWith('/base/')) { // it is not karma 
 
     basePath = basePath.replace(baseHref, ''); 
 
    } 
 
    } 
 
    else{ 
 
    var address=load.address; 
 
    address=address.replace('file:///'+__dirname+'/', ''); 
 
    var basePathParts = address.split('/'); 
 

 
    basePathParts.pop(); 
 
    var basePath = basePathParts.join('/'); 
 
    } 
 

 
    load.source = load.source 
 
    .replace(templateUrlRegex, function(match, quote, url){ 
 
     var resolvedUrl = url; 
 

 
     if (url.startsWith('.')) { 
 
     resolvedUrl = basePath + url.substr(1); 
 
     } 
 

 
     return 'templateUrl: "' + resolvedUrl + '"'; 
 
    }) 
 
    .replace(stylesRegex, function(match, relativeUrls) { 
 
     var urls = []; 
 

 
     while ((match = stringRegex.exec(relativeUrls)) !== null) { 
 
     if (match[2].startsWith('.')) { 
 
      urls.push('"' + basePath + match[2].substr(1) + '"'); 
 
     } else { 
 
      urls.push('"' + match[2] + '"'); 
 
     } 
 
     } 
 

 
     return "styleUrls: [" + urls.join(', ') + "]"; 
 
    }); 
 

 
    return load; 
 
};

來源

2017-06-20 21:01:36

如何將文件注入到systemjs-builder中以捆綁角4.0.0應用程序？

回答

相關問題