問題タブ [semantic-ui-css]

Webpack +セマンティック UIを使用しようとしていますが、成功しません。私は試した...

1. npm i semantic-ui-css
2. 私の中index.jsで..import semantic from 'semantic-ui-css'

3. 構成を自分に追加しますwebpack.config.js

   /li>

しかし、ビルドしようとすると... エラー..

./src/index.js のエラー モジュールが見つかりません: エラー: /Users/ridermansb/Projects/boilerplate-projects/vue/src @ ./src/index.js 15 のモジュール 'sematic-ui-css' を解決できません: 20-45

完全なソースはこちら

最初にセマンティック ui をダウンロードしてから、npm のインストールを試みましたが、どれもより少ないファイルを作成しませんでした。セマンティックUIの少ないファイルを取得するにはどうすればよいですか?セマンティックUIは少ないファイルのみを使用し、sassとスタイラスは使用しませんか?

私は初心者で、semantic-ui の Less ファイルを自動接頭辞にする方法を知りたいですか? ドキュメントによると、

私はセマンティック UI が初めてです。Foundation 6 で SASS を使用するには、_settngs.scss を編集してカスタマイズします。Semantic-UI で同等の LESS ファイルは何ですか?

Web サイトに上部の固定メニューと左側の垂直メニューの両方を表示しようとしています。私は本当に両方を修正したいのですが、スクロールを開始すると、以下のコードと jsfiddle に示すように、左側の垂直メニューがトップ メニューの下にスライドします。

https://jsfiddle.net/318ruL3j/2/

固定の垂直メニューを使用すると、次のコードと jsfiddle に示すように、最初の項目がトップ メニューの下に非表示になります。

https://jsfiddle.net/z5vozbts/2/

私がやろうとしていることが理にかなっていることを願っています。アイテムが重複することなく、これらの固定メニューの両方を使用する方法を知っている人はいますか?

これは、セマンティック UI css のレンダリング動作に関するものです。

HTML ページ (index.html と呼びます) 内に、次のようなポストローダーがあります。

これにより、この DOM 要素のコンテンツが満たされます。

実際に生成されるのは次のとおりです。

問題は、JavaScript で読み込まれたコンテンツが全幅でレンダリングされないことです (行クラスから継承されます)。セマンティックのような言語では、幅はわずか 1 ～ 2 列です。しかし、コンテンツを静的に埋めると (Javascript 関数を介して生成されるのと同じ DOM 構造でハードコーディングされます)、完全な with でレンダリングされます。開発にはFFとChromeを使用しています。

これまでのところ純粋な CSS であるため、動的にロードされた新しい要素は静的要素とまったく同じように動作するべきではありませんか?

私がやろうとしていることは次のとおりです。

出力はコンピューターで適切に表示され、モバイルでも適切にスタックされますが、item3 は表示されません。item4,5...n を追加すると、それらも非表示になります。

ここで何か間違ったことをしていますか、それともバグですか?

前もって感謝します！