[{"data":1,"prerenderedAt":104},["ShallowReactive",2],{"legacy-question-019951426dc5cc84c034931fce4e10e3":3,"legacy-question-author-koji-kadoma":77,"legacy-question-category-website-building":93},{"id":4,"title":5,"author":6,"body":7,"category":64,"date":65,"description":5,"extension":66,"locale":67,"meta":68,"navigation":69,"path":70,"seo":71,"slug":72,"stem":73,"tag":74,"updated":65,"__hash__":76},"legacyQuestions\u002F20210409000000-Grdisomeでビルドしたサイトをプレビューしたい.md","Grdisomeでビルドしたサイトをプレビューしたい","koji-kadoma",{"type":8,"value":9,"toc":60},"minimark",[10,14,18,21,34,37,40,43,54,57],[11,12,13],"h2",{"id":13},"pythonの簡易サーバーを使うとプレビュー出来ます",[15,16,17],"p",{},"Gridsomeでビルドしたサイトはパスが相対パスになっているので、そのままindex.htmlを開く形ではプレビューが出来ません。",[15,19,20],{},"方法としては、",[22,23,24,28,31],"ol",{},[25,26,27],"li",{},"ローカルにWebサーバーを設定する（Apacheなど）",[25,29,30],{},"ホスティングサーバーのテスト環境にアップする",[25,32,33],{},"プログラム言語の簡易サーバーを使う",[15,35,36],{},"がありますが、pythonの簡易サーバーが簡単で便利です。",[15,38,39],{},"macOSやLinuxであれば、pythonはデフォルトでインストールされていますし、WindowsでもWSLをインストールしていれば、Linuxのpythonが使えます。",[15,41,42],{},"pythonの簡易サーバーでのプレビューの仕方は、",[44,45,50],"pre",{"className":46,"code":48,"language":49},[47],"language-text","\u002F\u002F プロジェクトのdistディレクトリに入る\ncd dist\n\n\u002F\u002F pythonサーバーを立ち上げる\npython -m SimpleHTTPServer 8888\n","text",[51,52,48],"code",{"__ignoreMap":53},"",[15,55,56],{},"これで、ブラウザで「localhost:8888」にアクセスすると、ビルドしたGridsomeのサイトが本番のサーバーと全く同じように動くはずです。",[15,58,59],{},"Gridsomeはプレビュー用の開発サーバーとビルドしたファイルの挙動が違うことがあるので、この方法でプレビューしておくとエラーチェックなどを確実に行えます。",{"title":53,"searchDepth":61,"depth":61,"links":62},2,[63],{"id":13,"depth":61,"text":13},"website-building","2021-04-09T02:00:00.000Z","md","ja",{},true,"\u002F20210409000000-grdisome",{"title":5,"description":5},"019951426dc5cc84c034931fce4e10e3","20210409000000-Grdisomeでビルドしたサイトをプレビューしたい",[75],"gridsome","OICHEo42U_Jnq7h0-Rkz6kCH9iGW4GyEDu65s8ENBJA",{"id":78,"title":79,"body":80,"date":84,"description":85,"extension":66,"locale":67,"meta":86,"name":89,"navigation":69,"path":90,"seo":91,"slug":6,"stem":6,"updated":84,"__hash__":92},"legacyAuthors\u002Fkoji-kadoma.md","Koji Kadoma",{"type":8,"value":81,"toc":82},[],{"title":53,"searchDepth":61,"depth":61,"links":83},[],"2021-04-01T00:00:00.000Z","Webエンジニアです。Javascript、PHP、Ruby、Dockerなどをメインで使っています。",{"image":87,"url":88},"https:\u002F\u002Fwww.codit.work\u002Fimgs\u002Favatar\u002Fkoji-kadoma.png","https:\u002F\u002Fkoji.pages.dev\u002F",null,"\u002Fkoji-kadoma",{"title":79,"description":85},"H1yaGicrsv1CzYTbFeEXQosuYx93lIutD3_XwXMhAFk",{"id":94,"title":95,"body":96,"date":84,"description":95,"extension":66,"locale":67,"meta":100,"navigation":69,"path":101,"seo":102,"slug":64,"stem":64,"updated":84,"__hash__":103},"legacyCategories\u002Fwebsite-building.md","Webサイト構築",{"type":8,"value":97,"toc":98},[],{"title":53,"searchDepth":61,"depth":61,"links":99},[],{},"\u002Fwebsite-building",{"title":95,"description":95},"h9jPLD2mzMm3L4sFN5qWSiSirySQQLdnxLhQcvw8VlQ",1783320300779]