6

いくつかの Noir の Web サイトを Compojure に変換しています。

ここに、ページのレイアウトを作成する関数があります。 

(defn layout [title & content]
  (html5
   [:head
    [:title "My Site | " title]
    (include-css "css/main.css")
   [:body
    [:header 
     [:h1 (link-to "/" "My Site")]]
    content]))

そして、これは関数とルートです:

(defn home-page []
  (layout
   "Home"
   [:div [:p "Home Page"]])))

(defn article-list []
  (layout
   "Article List"
   [:div [:p "Article List"]])))

(defroutes app-routes
  (GET "/" [] (home-page))
  (GET "/article-list" [] (article-list))

localhost:3000/article-list を開くと、すべての CSS ルールが正常に機能します。

ただし、URL パスを拡張してプログラムを次のように変更しようとすると:

(defn article-list []
  (layout
   "Article List"
   [:div [:p "Article List"]])))

(defn article-one []
  (layout
   "Article One"
   [:div [:p "Article One"]])))

(defroutes app-routes
  (GET "/" [] (home-page))
  (GET "/article-list" [] (article-list)
  (GET "/article-list/article-one" [] (article-one))

localhost:3000/article-list/article-one に移動すると、すべての HTML を取得できますが、CSS ルールが機能しなくなります。ページを調べると、CSS パスが < head > 要素に含まれていますが、ページにスタイルがありません。

この問題の解決策を探しましたが、これに関する記述はないようです。また、次のようにルートを引き出してみました。

(defroutes article-routes
  (GET "/article-list/article-one" [] (article-one))

(defroutes app-routes
  (GET "/" [] (home-page))
  (GET "/article-list" [] (article-list)
  (context "article-list" [] article-routes)

しかし、私は同じ問題を抱えています。パスが拡張されたページで CSS ルールを機能させるにはどうすればよいですか?

4

1 に答える 1

5

CSS は相対パスで含まれています。つまり、localhost:3000/article-list/article-oneブラウザにアクセスすると、 で CSS が検索されlocalhost:3000/article-list/css/main.cssます。

これを修正する最も簡単な方法は、CSS を(include-css "/css/main.css"). 先頭の/は、常に を検索するようにしますlocalhost:3000/css/main.css。

于 2013-06-23T06:27:33.703 に答える