2015-12-16 65 views
3

我正在使用React,Webpack和Bootstrap-Sass創建客戶端應用程序。我試圖導入外部引導,薩斯庫,但不斷收到以下錯誤在終端:使用webpack導入外部bootstrap-sass庫時出錯

"File to import not found or unreadable: bootstrap-sass/assets/stylesheets/bootstrap/variables" 

看來好像在我webpack.config.js的SCSS裝載程序沒有被正確讀取變量文件引導,青菜;然而,我試過使用/創建幾個不同的scss加載器,他們都無法解決這個問題。

這裏是我的webpack.config.js文件:

var StaticSiteGeneratorPlugin = require('static-site-generator- webpack-plugin'); 
var data = require('./data'); 
var path = require('path'); 


module.exports = { 
    entry: './entry.jsx', 

output: { 
    filename: 'bundle.js', 
    path: __dirname, 
    libraryTarget: 'umd' 
}, 

module: { 
    loaders: [ 
{ test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' }, 
{ test: /\.jsx$/, exclude: /node_modules/, loader: 'babel-loader' }, 
{ test: /\.css$/, loaders: [ 'css' ] }, 
{ test: /bootstrap-sass\/assets\/javascripts\//, loader: 'imports?jQuery=jquery' }, 
{ test: /\.scss$/, loader: "css!sass?includePaths[]=" + 
    path.resolve(__dirname, "./bower_components/bootstrap-sass/assets/stylesheets/")}, 
{ test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff" }, 
{ test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff" }, 
{ test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/octet-stream" }, 
{ test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file" }, 
{ test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=image/svg+xml" } 
    ] 
}, 

    plugins: [ 
new StaticSiteGeneratorPlugin('bundle.js', data.routes, data) 
    ], 
} 

base.scss文件:

// include bootstrap stylesheets 
$icon-font-path: "../node_modules/bootstrap- sass/assets/fonts/bootstrap/"; 
@import "../node_modules/bootstrap- sass/assets/stylesheets/_bootstrap.scss"; 
@import "../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap-compass.scss"; 
@import "../node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_variables.scss"; 
@import"index.scss"; 

// include omni stylesheets 
@import "../bower_components/omni-bootstrap/assets/stylesheets/omni"; 

任何幫助或建議,非常感謝!

回答

0

改變下面的行:

@import "../bower_components/omni-bootstrap/assets/stylesheets/omni"; 

到:

@import "../../bower_components/omni-bootstrap/assets/stylesheets/omni";