2016-04-25 72 views
0

我得到什么,似乎试图利用与SASS时的WebPack是一个缺少装载机错误和react.js您可能需要适当的加载程序来处理此类文件

我已经修改的WebPack代码:

// webpack.config.js 
var webpack = require('webpack') 

if(process.env.NODE_ENV === 'development'){ 
    var loaders = ['react-hot','babel'] 
} else { 
    var loaders = ['babel'] 
} 
module.exports = { 
    devtool: 'eval', 
    entry: './app-client.js', 
    output: { 
    path: __dirname + '/public/dist', 
    filename: 'bundle.js', 
    publicPath: '/dist/' 
    }, 
    module: { 
    loaders: [{ 
     test: /\.js$/, 
     loaders: loaders, 
     exclude: /node_modules/ 
    }, 
    { 
    test: /\.scss$/, 
    loaders: ["style", "css", "sass"] 
    } 
    ]}, 
    plugins: [ 
    new webpack.DefinePlugin({ 
     'process.env.COSMIC_BUCKET': JSON.stringify(process.env.COSMIC_BUCKET) 
    }) 
] 
}; 

./components/App.js里面我有以下:

//styles 
import style from '../styles/footer.scss' 

./components/partials/Footer.js的内部我修改className值到FO如下:<footer className={ style.foo }>。但是现在在页面加载空白,出现以下错误:

Footer.js:28 Uncaught (in promise) ReferenceError: style is not defined

我那么感动Footer.js组件内部导入:

import style from '../../styles/footer.scss'

但现在我越来越: ReactReconciler.js:54 Uncaught TypeError: Cannot read property 'getNativeNode' of null

我在哪里输入样式?

回答

-1

带走在那里SASS,你的配置应该是这样的

{ test: /\.scss$/, loader: "style-loader!css-loader!sass-loader" } 
+0

我这样做,伴您行替换上面。我仍然有同样的错误。 – HGB

相关问题