WebPACKのは、私がここからのWebPACKの設定をとっている私のSCSSクラス

Question

の名前を変更された：生産バージョンのために

https://github.com/erikras/react-redux-universal-hot-example 

1. を、私は提案された変更を行い、現在は少なく、SCSSとCSSの ローダーは、次のようになりこの

    { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader')}, 
        { test: /\.less$/, loader: 'style!css?importLoaders=2&sourceMap!autoprefixer?browsers=last 2 version!less?outputStyle=expanded&sourceMap' }, 
        { test: /\.scss$/, loader: ExtractTextPlugin.extract('style', 'css?modules&importLoaders=2&sourceMap!autoprefixer?browsers=last 2 version!sass?outputStyle=expanded&sourceMap=true&sourceMapContents=true') } 
   

2. は私がすなわち

   必要が使用してスタイルシートをロードしています（「../ pathToSCSSSTylSheet」）が必要です

CSSがうまくロードされますが、SCSSクラスはWebPACKので製造された最終のスタイルシートにリネームされているので、クラスは適用されません飽きません。どのようにこれらのscssクラスの名前変更を停止するのですか？

私は&localIdentName=[local]___[hash:base64:5]を採取し、あまりにもそれを維持しようとしたが、授業はとにかく

Answer 1

が、これはCSSモジュールを有効にする、modulesオプションを削除変更されています。

https://github.com/webpack/css-loader#user-content-css-modulesを参照してください。

あなたがmodulesオプションを削除したくない場合は、thisのように使用することができますが：

import styles from './app.scss'; 
export default class InfoBar extends Component{ 
    render(){ 
    const styles = require('./InfoBar.scss'); 
    return (
     <span className={styles.time}>10:00</span> 
    ); 
} 
} 

Answer 2

あなたはそれがグローバルスタイルとしてのスタイルをインポートします。この

:global { 
    @import 'scss_path'; 
} 

のようなスタイルをインポートすることができ、名前を変更せずにscssクラスを取得します。