2140日くらい過ぎています。年で言ったら5.86年くらいです。情報が古くなってる可能性もあるので参考程度に御覧ください。ローカル環境で開発やWordPressのテーマ構築なんかをする場合、MAMPとかXAMPPといったツールを使って、或いはMacならMacについてるApacheとかつかってサーバーを建てると思いますが、デフォルトのままだと、プロジェクトごとにlocalhost/~username/project/wp/みたいな感じにすると思いますが、これだとURLがアレな感じだったり、サイトルートからパスを指定するときに問題があったりします。/>と指定すると、localhost/~username/img/logo.pngを参照しようとしてしまい、画像が表示されません。相対パスを使えばまぁいいっちゃいいんですが、階層が複雑になってきて、localhost/~username/project/contents/sidebars/sidebar.htmlみたいな奥深くからlocalhost/~username/project/img/logo.pngを呼ぼうとすると、上の階層に戻るための「../」がどんどん増えていって訳がわからなくなりますし、上の例だと本番と階層が異なることになりローカルではちゃんと見られたのにサーバーに入れたら見られなくなったー!の原因になりかねません。いうことで、プロジェクト単位でバーチャルホストを切ってプロジェクトフォルダからサイトルート相対パスを使えるようにしましょう、というお話です。やりたいこと前置きが長くなりましたが、今回やりたいことは簡単にいえばこういうことですバーチャルホストを指定して、プロジェクトの階層に「localhost」のように「project.dev」みたいな感じでアクセスできるようにする上記の結果、サイトルート相対パスで画像やスタイルシートを呼べるようにするではさっそく指定していきます。設定を進めていきますが、MAMPとかでも同じようにできると思います。今回いじるファイルの位置とかは変わってきますが。編集まずは、XAMPPのApacheでバーチャルホストを使えるようにするため、httpd.confファイルを編集します。/Applications/XAMPP/etc/extra/httpd-vhosts.confとして保存します。変更するにあたってパスワードを聞かれるので入力します。読み込むようになりました。/Applications/XAMPP/xamppfiles/etc/extra/httpd-vhosts.confを開きましょう。はじめから色々とサンプルが書かれています。いらないなら消してもいいし、あとで参考にするためにコメントアウト(行頭に「#」をつける)しておいても良いと思います。これまでと基本的な挙動は変わらないように、以下を追記します。ホームが表示されるようになります。続いて、通常のドキュメントルートも設定しておきましょう。localhost/~usernameとしています。(usernameはMacのユーザー別ホームディレクトリ名です)これで「サイト」以下に配置されてるファイルに「localhost/~username」でアクセスできるようになります。保存して(これもパスワード聞かれるのでパスワード入力し)設定を読み込ませるためにXAMPPのApacheを再起動します。プロジェクトごとにバーチャルホストを切るようやく本題です。気づいたかもしれませんが、「httpd-vhosts.conf」で設定した「ServerName」にアクセスすると「DocumentRoot」以下が表示されるようになります。(実際にはもう1ステップ必要なのですが)ということで、今回の目標である「project.dev」にアクセスしたら「localhost/~username/project/」というか、「/Users/username/Sites/project/」のファイルが開くようにするためには、以下のようにかけばいいことになります。project.devパスワードを入力して保存したらこのファイルでの作業は終わりです。自分が取得してるドメインである必要もありません。プロジェクト名だけでもまぁ構わないと思います。いうファイルを修正します。これやらないといくらバーチャルホストを切っても表示できません。これはこのMacが「project.dev」にアクセスしたらどこを表示すればいいのかわからないからです。DNS設定しないとドメイン名でアクセスしても表示されないのと似たような感じだと思います。ありますので、まずはファインダーを開きましょう。G」と押すと「フォルダの場所を入力」と言われるので「/etc/」と入力して「移動」を押せばOKです。hostsファイルをエディタで開いて以下のように追記します。hosts127.0.0.1project.dev1127.0.0.1project.devこれまた保存にはパスワードが必要なので入力してください。これで、Macが「project.dev」にアクセスしたら「127.0.0.1」に接続するようになります。127.0.0.1というのはループバックアドレスといい、自分自身を指すIPアドレスです。ここまで完了したら念のためもう一度サーバーを再起動してから、「project.dev」にアクセスしてみましょう。アクセスした時と同じサイトが表示されれば成功です。いうアプリを使う方法もあります。プロジェクトにしちゃってます。ST2で新しいウィンドウを開き、この2つのファイルを開きます。選択し、適当に名前を付けて保存します。自分は「virtual-host-settings.sublime-project」としました。これをどっか適当なところに保存すると、「virtual-host-settings.sublime-project」と「virtual-host-settings.sublime-workspace」という2つのファイルができるので、「virtual-host-settings.sublime-project」の方をDockにドラッグ・アンド・ドロップで入れておきます。これでいつでもすぐにバーチャルホスト設定ができるようになります。ちなみにプロジェクトファイルのアイコンこれを使わせてもらってます。キャンセル投稿を送信できませんでした。メールアドレスを確認してください。メール送信チェックに失敗しました。このブログではメールでの投稿共有はできません。%d人のブロガーが「いいね」をつけました。