2016-05-24 11 views
0

を使用して変数やミックスインを読み込むことができません、そうするためには、私が設定しています。私はこのコードを書いた:私は<code>inline-styles</code>で<code>twitter-bootstrap</code>を使用したいインラインスタイルローダー

import normalize from 'radium-normalize' 
import m from '../node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_mixins.scss' 
import v from '../node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_variables.scss' 
import sc from '../node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_scaffolding.scss' 
import t from '../node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_type.scss' 
import buttons from '..//node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_buttons.scss' 

私はこのようなradiumによって提供さStyleコンポーネントにこれらを追加しよう:

const baseRules = {...normalize, ...m, ...v, ...sc, ...type} 
const App =() => (
    <div> 
    <Style rules={baseRules} /> 
    <HelloWorld /> 
    </div> 
) 

私はこれらのエラーは、変数とミックスインが定義されていなかったことを私に知らせる得る:

ERROR in ./~/bootstrap-sass/assets/stylesheets/bootstrap/_scaffolding.scss 
Module build failed: 
    @include box-sizing(border-box); 
     ^
     No mixin named box-sizing 

Backtrace: 
    stdin:12 
     in /home/vamsi/Do/webpack-npm-plugin/node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_scaffolding.scss (line 12, column 12) 
@ ./src/index.js 21:19-107 

ERROR in ./~/bootstrap-sass/assets/stylesheets/bootstrap/_type.scss 
Module build failed: 
    font-family: $headings-font-family; 
      ^
     Undefined variable: "$headings-font-family". 
     in /home/vamsi/Do/webpack-npm-plugin/node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_type.scss (line 11, column 16) 
@ ./src/index.js 25:12-93 

ERROR in ./~/bootstrap-sass/assets/stylesheets/bootstrap/_buttons.scss 
Module build failed: 
    font-weight: $btn-font-weight; 
      ^
     Undefined variable: "$btn-font-weight". 
     in /home/vamsi/Do/webpack-npm-plugin/node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_buttons.scss (line 12, column 16) 
@ ./src/index.js 29:15-100 

答えて

0

@importあなたがミックスインが必要なscssファイルにブートストラップすることを確認してください。同形のスタイルでは、エントリーポイントが何であるかわからないので、一箇所で使用して忘れてしまうようなことはありません。

は次のようにインポートしてみてください。

@import "~/bootstrap-sass/assets/stylesheets/bootstrap/mixins" 

~文字が

+0

modulesDirectoriesリゾルバ(See more)に見えるようにWebPACKのを教えてくれますインラインスタイルローダーが使用する間違ったことで、それはで使用するためのスタイルを変換し、私はjavascriptオブジェクトに変換する必要があります。私は、Twitterのブートストラップのようなものから、より少ない/嫌なものを取り除いて、ラジウムで使うためにコンパイルする方法を理解したいと思います。ラジウムローダーは私のためにエラーを投げます。 – vamsiampolu

関連する問題