Material-ui in production css

我有一個'dashboard'應用程序，它使用material-ui，然後在該儀表板內部調用並呈現其中的其他應用程序。這在dev中運行良好，但是一旦我使用生產構建材料ui classnames衝突並將一堆東西搞亂。Material-ui in production css

我不確定在這裏提供什麼，但有沒有辦法將前身應用到CSS名稱？所以我可以有這樣的名字，如.main-c1,app2-c1,app3-c1等？目前，當我渲染app2它重寫所有類

來源

2017-10-13 John

我還是很新的這個，所以原諒我，如果它不是最好的答案。我覺得爲每個應用定義不同的主題可能是實現您想要的結果的有用方法。做這樣的事情

export default { 
spacing: spacing, 
    fontFamily: 'Roboto, sans-serif', 
    palette: { 
    primary1Color: cyan500, 
    primary2Color: cyan700, 
    primary3Color: grey400, 
    accent1Color: pinkA200, 
    accent2Color: grey100, 
    accent3Color: grey500, 
    textColor: darkBlack, 
    alternateTextColor: white, 
    canvasColor: white, 
    borderColor: grey300, 
    disabledColor: fade(darkBlack, 0.3), 
    pickerHeaderColor: cyan500, 
    clockCircleColor: fade(darkBlack, 0.07), 
    shadowColor: fullBlack, 
    }, 
};

只是當您調用主題提供程序時加載到您的不同應用程序時提供了不同的mUI主題。

<MuiThemeProvider muiTheme={YOUR-THEME-HERE}> 
<AppBar title="My AppBar" /> 
</MuiThemeProvider>

mUI Theme Doc

希望這有助於至少一點點。

來源

2017-10-13 17:38:44 Afro

我遇到的問題是，當我渲染第二個應用程序時，它會重新創建所有css（因此c1會被重新寫入與以前完全不同的東西），但舊組件仍然存在。所以他們的CSS得到了全部的重擊。我發現安裝'react-jss'並將每個應用程序包裝在其中，然後使用'classNamePrefix =「app1」'幫助了大部分內容。儘管如此，仍然有點混亂 – John

Material-ui in production css

回答

相關問題