Jak mapować ./[module] na /[module]/[module].js w System.JS?

Question

próbuję zaimportować materiał-ui do mojego React aplikacji wykorzystujące System.JS

W mojej aplikacji, to robię:

import {AppBar, Tabs, Tab, Card, CardTitle} from 'material-ui'; 

Oto mój System.JS config:

System.config({ 
    baseURL: '/node_modules', 
    packageConfigPaths: [ 
     '*/package.json' 
    ], 
    packages: { 
     '.': { 
      defaultExtension: 'js', 
      main: 'index.js' 
     }, 
    } 
}); 

ładuje node_modules/material-ui/index.js który ma kilka importu wewnątrz niego:

var _AppBar2 = require('./AppBar'); 

var _AppBar3 = _interopRequireDefault(_AppBar2); 

var _AutoComplete2 = require('./AutoComplete'); 

var _AutoComplete3 = _interopRequireDefault(_AutoComplete2); 

// ... etc, about 40 of them. 

exports.AppBar = _AppBar3.default; 
exports.AutoComplete = _AutoComplete3.default; 

// ... etc 

w drzewo struktury pakietu, każdy z tych modułów jest przechowywany pod własnym katalogu tak:

material-ui/ 
    index.js 
    AppBar/ 
    AppBar.js 
    index.js -- just reexports './AppBar' 
    AutoComplete/ 
    AutoComplete.js 
    index.js -- just reexports './AutoComplete' 

, itd., Więc w rzeczywistości importować material-ui/AppBar muszę System.JS załadować node_modules/material-ui/AppBar/AppBar.js lub node_modules/material-ui/AppBar/index.js.

Zamiast tego System.JS próbuje załadować node_modules/material-ui/AppBar.js, którego tam nie ma.

Jeśli dodać poszczególne wpisy dla każdego modułu pod packages:

'material-ui': { 
    map: { 
     './AppBar': './AppBar/AppBar.js' 
    } 
} 

to działa, jednak symbole wieloznaczne:

'material-ui': { 
    map: { 
     './*': './*/*.js' 
    } 
} 

nie.

Jak utworzyć Mapę System.JS ./* na ./*/*.js w ramach określonej paczki?

---

Na marginesie, browserify nie ma żadnych problemów z tego układu, więc kiedy połączą mojej aplikacji przy użyciu browserify prostu dzwoniąc browserify('./path/to/root/index.js'), wszystkie moduły materiałowe-ui dostać importowane bez żadnych problemów.

Answer 1

Ścieżki wieloznaczne nie są supported w pliku System.js. Będziesz musiał ręcznie dodać wpis dla każdego modułu:

'material-ui': { 
    map: { 
    './AppBar': './AppBar/AppBar.js', 
    './AppHeader': './AppHeader/AppHeader.js', 
    './AppFooter': './AppFooter/AppFooter.js', 
    //etc 
    } 
} 

Można również użyć jspm wygenerować ten wykaz dla Ciebie.