styled-components

1熱

1答えて

スタイルアップコンポーネントをロールアップビルドの外部として追加するにはどうすればよいですか？

以下の複製で私のrollup.config.jsにスタイル付きコンポーネントを追加しようとしていますが、エラーが発生します。私はreact-router-domについて同様の問題があり、rollup.config.jsのreact-router-dom/Linkにreact-router-domの名前を変更して解決しました。 styled-componentsでの操作方法は？再現： // rol

1熱

2答えて

スタイリッシュなコンポーネントをホットリロードする方法は？

以下のようなスタイルのコンポーネントウェブパックを変更した後。私はどのようにホットなスタイルのコンポーネントをリロードできますか？ [HMR]以下のモジュールはホット更新できませんでした。（フルリロードが必要）に変更されたモジュール（および両親が）熱い自分自身をリロードする方法がわからないので、これは通常です。 UPDATE：私は1.1.2

0熱

1答えて

Styled-Suppnnet用の属性セレクタ

sytled-componentを使用するときに属性セレクタを使用できますか？ &:hover, &[active='true']{ transform: translateY(-4px); box-shadow: 0 7px 16px 0px rgba(255,63,23,0.87), } アイデアは、私はそうでなければ、私はコードを複製する必要があり、それははるかに醜

1熱

1答えて

スタイル付きコンポーネントで$ {props => props.myProp}を回避する方法はありますか？

${props => props.myProp}は、どうすればstyled-componentsに書き込むことができますか？例えば、我々はボタンスタイリングされている場合：私たちは${props => props.myProp}のようなものを書く必要があるドキュメントhereとhereで const Button = styled.button` background: ${props

1熱

1答えて

SVG線の太さと隙間の不均一を防ぐにはどうすればいいですか？

私のユースケースはおそらくちょっとユニークですが、私はflexboxで囲まれたDOM要素を使って動的に大きさの四角いグリッドを作成しています。各DOM要素は、SVG画像の背景と、calc(100vmin/<gridSize>)に等しい高さ/幅を持ちます。 SVG要素は単純です： <svg xmlns="http://www.w3.org/2000/svg" width="100" height="

3熱

1答えて

スタイル・コンポーネントにpropを渡すときにタイプ・スクリプト・エラーが発生する

このタイプ・スクリプトの問題を解決するのに苦労します。 ...message: 'Type '{ show: boolean; children: Element; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<ThemedOuterStyledProps<HTMLPro

2熱

1答えて

psuedoセレクタはUnicode文字を含むCSSと同じスタイルのコンポーネントで動作しますか

次のスタイル付きコンポーネントがあり、疑似セレクタのコンテンツとしてユニコード文字\00d7を追加しようとしています。閉じるアイコン。しかし、これはCSSの場合と同じようには動作しません。もちろん、このクローズアイコンの代わりにsvgを使用することはできますが、これはスタイル付きコンポーネントで可能なのか不思議でした。空白の擬似セレクタを許可しているようです。 '' const Close =

1熱

1答えて

ReactプロジェクトでStyled Componentsファイルを整理する方法

ReactプロジェクトでStyled Componentsをどのように整理すればよいですか？私は例えば - 私は、スタイルを追加したいNavbarコンポーネントを持っています。別のファイルNavbarStyleを作成してNavbarにインポートするか、NavbarコンポーネントでNavbarStyleを作成するか他のものを作成する必要がありますか？それとも、ボタンのような一般的なコンポーネント用で

1熱

1答えて

フロートは左または表示インラインブロックは、スタイル付きのコンポーネントで動作していない

は私がフロート左と表示インラインブロックを使用してみましたが同じdiv要素ではなく不使用のIの画像とテキストを取得したいreactjs私がやっている間違いを犯すことはできません。私はreactjsでスタイルのコンポーネントを使用を次のように私は、出力を取得しています。これらは私が export const BannerContainer = styled.div` width: 1

0熱

1答えて

なぜこのコードはES6（React）で動作するのですか

私はReactコースを辿り、styled-componentsからコンポーネントをインポートするこのレッスンに出くわしましたが、私には不思議なことに4行目があります。それを括弧で囲むと、バックティックとstyled.headerの間にスペースを入れてはいけないようです。呼び出しタグ付きのテンプレートリテラル