Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Proposal]: ルートディレクトリの指定文字の追加 #208

Open
mantaroh opened this issue Jan 25, 2024 · 4 comments
Open

[Proposal]: ルートディレクトリの指定文字の追加 #208

mantaroh opened this issue Jan 25, 2024 · 4 comments

Comments

@mantaroh
Copy link
Collaborator

📦 Package / パッケージ

spear-cli

📝 Describe the problem / 問題を記載

問題点

サブディレクトリのページで Spear を使用する際、assets などのディレクトリを作成した場合、ルートディレクトリを知らないと実装が難しくなるケースがあります。

例:

  • /src/subdirectory/index.html
<script src="assets/js/test.js">

/src/assets/js/test.js を参照したいが、サブディレクトリなので、 ../ をつける必要がある。

🤔 Describe your idea / アイデアを記載

{%= spear_root %} のようにトップディレクトリを知っていれば、そこからの相対パスを自動で生成することが可能となる。

📄 Additional Information

No response

@vladinomo
Copy link
Contributor

現行だとhtml/spearのファイルから特殊なことをせずとも
<script src="/assets/js/test.js">(絶対パス指定をスラッシュで始める)
とすることで、トップディレクトリからのリソースが簡便に取得できるようです。
また、spear-cliパッケージのソースコードを読み込む限りだとトップディレクトリはsrcで固定です。
以上を総合すると特殊文字でトップディレクトリを指定できる機能は追加しないでもいい気がしています。

@mantaroh
Copy link
Collaborator Author

遅くなってすみません!!

現行だとhtml/spearのファイルから特殊なことをせずとも <script src="/assets/js/test.js">(絶対パス指定をスラッシュで始める) とすることで、トップディレクトリからのリソースが簡便に取得できるようです。 また、spear-cliパッケージのソースコードを読み込む限りだとトップディレクトリはsrcで固定です。 以上を総合すると特殊文字でトップディレクトリを指定できる機能は追加しないでもいい気がしています。

ですです!
絶対パス形式であれば、ルートから参照ができるので問題ないです!

今回、問題となるケースが、 https://foobar.com/ というアドレスを持っていて、そのサブディレクトリに Spear プロジェクトのページを配置したいとなったときです。 (https://foobar.com/sub-pages/)

/sub-pages/index.html のコードでは、 /assets/images/test.png という参照があった場合、https://foobar.com/assets/images/test.png を参照にすることになります。
実際のコード上では、/sub-pages/assets/images/test.png を参照してほしいのですが、それができないです。

.
└── src(sub-pages)
    ├── assets
    │   └── images
    │       └── test.png
    └── index.html

→このプロジェクトを https://foobar.com/sub-pages/ へデプロイしたとき問題

解決方法としては、

  1. src/subpages を作る
.
└── src
    └── sub-pages
        ├── assets
        │   └── images
        │       └── test.png
        └── index.html

このような構造にすれば、絶対参照でも問題なく動作します。
問題として、直感的にわかりにくいかなーと思いますが、どうでしょう。。

  1. {%= spear_root %} を用意してあげる

ルートディレクトリ名がわかれば、参照方法などわかるのではないかと。

例: https://foobar.com/sub-pages/ にプロジェクトをデプロイするとき

{%= spear_root %} = 「/sub-pages/」が入っていれば、画像参照も {%= spear_root %}/assets/images/test/png と参照できると思います。

また、このルートディレクトリは設定値 (spear.config.mjs) に入れることで、参照もしやすいかと思います。

@vladinomo
Copy link
Contributor

vladinomo commented Feb 15, 2024

@mantaroh
内容把握しました。spearのプロジェクト自体がなにかのサブディレクトリとして配信される場合ということですね。

  1. src/subpages を作る

確かにこれは直感的でないですね。

> 2. {%= spear_root %} を用意してあげる

この方針の上で、spear.config.mjsの設定値は、

  • rootDirはプロジェクトのルートというところでこの件とは別で残しておきたい。
  • src/assets は外部のリソースとは別に残しておいたケースもありそう

という理由で, extraAssetsPathみたいな名前で新しく用意し、コンポーネント中の式の名前もそれに準じて {%= spear_extra_root %}というのはどうでしょうか?

@mantaroh
Copy link
Collaborator Author

@vladinomo

という理由で, extraAssetsPathみたいな名前で新しく用意し、コンポーネント中の四季の名前もそれに準じて {%= spear_extra_root %}というのはどうでしょうか?

その方針で問題ないと思います!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants