マークダウンファイルをオフラインで表示する[終了]


609

.mdファイルをオフラインで表示してGithubにアップロードするとどのようになるかを知る方法はありますか?README.md編集目的ではなく、Githubで出力されるようにファイルを表示することを指します。

MacとWindowsの両方を使用しているため、MacとWindowsの両方で作業する必要があります。

回答:


428

適切に機能するChromeプラグインがいくつかあります。Markdown Preview Plusを使用しています。

インストール後、拡張機能で[ファイルのURLへのアクセスを許可]を有効にします(メニュー> [その他のツール]> [拡張機能]またはchrome://extensions/代わりにURL を入力)。

ここに画像の説明を入力してください

次に、MarkdownファイルをChromeにドラッグアンドドロップし、お気に入りのエディターを使用して編集します。


3
おかげで、Chrome拡張機能は常に役に立ちます。追加のソフトウェアを使用する必要がない
Avi

37
ありがとう!インストールされ、mdファイルが正しくレンダリングされなかった理由を理解できませんでした-「アクセスを許可...」が重要でした。
mattezell 2013年

1
Markdown Previewはコードブロックをサポートしていません
ACyclic

2
具体的には、Markdown Previewが `` `に遭遇すると、コードブロックのすべての行を1行に配置します。それで、私はswcoolによって言及されたMarkviewを試しました。スタイルはgithubと完全には一致しませんが、少なくともコードブロックの各行を別々の行に配置します。
EL Rayle 2015年

2
Markdown PreviewからMarkdown Preview Plusに切り替えました。コードブロックなどを修正するためです。これを反映するために上記の私の回答を編集しました。
ジムバーグマン

256

これを正確に行うために、グリップを少し前に書きました。GitHubとまったく同じようにレンダリングされ、いくつかの追加オプションも提供します。

  • READMEに加えて、GripはGitHubのコメントと問題をレンダリングできます
  • ローカルリンクをクリックして他の.mdファイルをレンダリングする
  • 独自のプロジェクトで使用するAPI
  • HTMLファイルにエクスポート

pipでインストール:

pip install grip

次に、READMEファイルが含まれているディレクトリに移動して実行します。

grip

-h追加のヘルプとオプションを渡します。

以下は、GripのREADMEをレンダリングするGripのスクリーンショットです。

グリップレンダリンググリップのスクリーンショット

お役に立てれば。こちらをご覧ください


2
@luchosrock正しくレンダリングされないMarkdownの要点を投稿していただけませんか?不一致がある場合は、バグを報告して修正します。
Joe

2
@luchosrock 2つを混同しているかもしれませんが。gfms自身のドキュメントによると、「現在のGFMSの実装ではソースコードブロックに色を付けていません」が、Gripではそうしています。Gripは、GitHub独自のMarkdown APIを使用し、カスタムソリューションではなく、すぐにスタイルを使用できるため、Gripが非常に正確になります。また、gfmsはノードベースであり、Pythonではありません。
Joe

2
他のソリューションとは異なり、Linuxの魅力のように動作します!ありがとう!
akhmed

5
軽量で素敵です。ありがとう!
ベンジャミンR

2
@Joeは自分でこれを発見しました。すごい仕事。美しく動作します。
idjaw

106

GithubによるAtom。並べてプレビューできます。

ここに画像の説明を入力してください

https://stackoverflow.com/a/26956920/375022


2
これは、多くの.mdファイルを編集する場合に便利です。また、別のアプリに切り替える必要がないインスタントプレビューは常にプラスです。
dval 2015年

自動スクロールパッケージさえあります:github.com/mark-hahn/markdown-scroll-sync。現在、警告なしで動作するには、github.com / mark-hahn / markdown-scroll-sync / pull / 66 / filesにパッチを適用する必要があります。
Dror

1
これも良い提案です。ペインを並べて表示するインスタントプレビューはおまけです。常に保存してタブで移動する必要はありません。
AnimNations

回答の下部にあるリンクは存在しません
xxx ---

64

Visual Studio Code-マイクロソフトの新しいエディターは、マークダウン編集にも非常に優れたサポートを提供します。こちら
からダウンロードできます。 エディターは、マークダウンコードプレビューモード切り替えるための優れたサポートを提供します。 また、すべてのマークダウン構文に適度に優れたインテリセンスサポートを提供します。 エディターは無料で使用できクロスプラットフォームでもあります(Linux、Windows、Macで動作)。 詳細については、ウェブサイトで確認できます



ここに画像の説明を入力してください


2
素晴らしくて簡単です!
Mayur Patil、

2
素晴らしい提案。MS Visual Codeは、さまざまな状況で、さまざまな目的に使用できる素晴らしいツールです。それは無料です; Windows、Linux、MacOSで動作します。
paulsm4

1
クール、すでにインストールしたソリューション!私は2つの小さなことを理解する必要がありました。プレビューペインを開くには、上部にあるファイルのタブを右クリックし、[プレビューを開く(Ctrl?Shift + V)]を選択します。@sundeepが言及するインテリセンスを呼び出すには、エディターウィンドウでCtrl + Spaceを押します。
arichards

3
プレビューするctrl + kv
aderchox

62

パーティーには遅れますが、MarkdownPadをご覧ください


21
github風味のマークダウンのサポートを取得したい場合は、MarkdownPad Proを入手する必要があります-15USD未満。私は個人的にそれのために多分5USDを支払うでしょうが、確かに15USDではありません。だから誰かが何か他のものを推薦できるなら、そうしてください。
burzum 2013

4
プロ版に15ドルを支払っただけで、その価値はありますが、Monoの下で実行すると、最近の開発者が進んでいるlinux / osxで使用できるので、すばらしいでしょう。
Tracker1 2013年

MarkdownPadはしばらく前から暴力団に入っているようだったので、私(開示アラート:はい、これを作成して販売しました)はMarkUpDownを作成しました。GitHub Markdownに対応している必要があります。そうでない場合は、その方法を教えてください。修正します。
ルフィン

37

Python-Markdown-Editorを参照してください

それはに基づいています:

  • Python-Markdown
  • Pygments(コードブロック構文の強調表示)
  • CodeMirror(JavaScriptコードエディター)
  • ボトル

pipでインストール:

$ pip install markdown-editor 

入力時にプレビュー、コードの強調表示、フェンスされたコードブロック、githubスタイルを備えています

コマンドラインで使用できます:

$ markdown_edit 

$ markdown_edit README.md

$ markdown_edit -f readme.html README.md

ここに画像の説明を入力してください

これを作成して、コードレビューを送信するためのツールを作成しました。カスタムアクションを追加できるモジュールとしてインポートすることで、簡単に拡張できます。


こんにちは、これは素晴らしいアプリのようですが、ほとんどの場合、エディタではなくビューアにしたいだけなので、2つの.mdファイルを同時に開くことはできません。これをlocalhost:8000 / <path / to / file.md > などの構文で拡張して、複数の.mdファイルを表示できるようにしますか?
arcticfox 2014年

-p <port>オプションで複数のファイルを編集できます
Nicolas Cornette

私のためにトレースバックエラーを出します
aderchox '17年

29

https://github.com/ypocat/gfmsをインストールしました。github風味のマークダウンをレンダリングする非常に良い仕事をします。マークダウンの変更を検出するため、ブラウザーとエディターを並べて配置するだけです。これはNode.jsなので、どのプラットフォームでも問題なく動作するはずです。

Node.jsがインストールされている場合、インストールは簡単です。

  1. sudo npm install -g gfms
  2. gfms --port 9999 (プロジェクトディレクトリ内)
  3. http://localhost:9999/ (任意のブラウザで開きます)

残念ながら、gfmsGFMのように改行をレンダリングしません。GFMのように、段落内に改行が1つある場合は<br>を挿入しません。しかし、「純粋な」Markdownレンダリングの場合は問題ありません。
Ed Ruder 2014年

2
より優れたGFM Markdownバックエンド(Marked)を使用し、改行を正しく挿入するgfmsの更新バージョン(github.com/pawel-wiejacha/gfms)があります。また、ディレクトリリストとPDFエクスポート機能も改善されています。
Pawel Wiejacha 2014年

5
有望に聞こえたので、私はこれを試しました。node.js(予想)とpythonもインストールする必要がありました。完全なC ++開発者ツールチェーンが必要なとき、私はあきらめました。したがって、プラットフォームによっては簡単かもしれませんが、Windowsを使用している場合は、この提案を試さないでください。
2015年

NodeJSで書かれたものはほとんどWindowsでは動作しません。「このソフトウェアをインストールする」ガイドが「npm install」で始まるとき、私は立ち去るだけの難しい方法を学びました。NodeJSは、開発者が人々に信じてもらいたいほどのクロスプラットフォームではありません。GolangとPythonも同様に悪いですが、Nodeほどではありません。私が知っている唯一のスクリプト言語は、本当にクロスプラットフォームであり、最小限の労力であらゆる場所で機能し、数百MBのジャンクをインストールする必要がないPHPです。PHP CLIは隠されたgemです。コマンドラインスクリプト言語としては、他の何よりも優れています。
CubicleSoft 2018年

27

PHPで表示する方法を見つけました。さらにスヌーピングを行った後、.mdファイルをオフラインおよびオンラインで表示するための2つの解決策を見つけました。

玉座で仕事をしているときでも編集できるように、オフラインバージョンをお勧めします。:)


1
.mdファイルを表示するためのデスクトップアプリもたくさんあります。
Matt Ball

知らなかった。彼らは何ですか?
12


@enchance、なぜPHPなのか?javascriptバージョンが良いでしょう。
ペーチェリエ2015

23

Google Chromeを使わない人もいます。Markdown Viewerと呼ばれるFirefoxアドオンがあり、Markdownファイルをオフラインで読み取ることができます。


1
いいですね、これがWebExtensions(ff 57+)の新しいリンクです。
Sam

何か不足していますか?「現在file:// URLはサポートされていません!」-そのようなものはこれを解決策として失格としないのですか?また、1つ星のレビューの多くは、Webextの1つが機能しないと述べています。
ミッチ

19

ReTextを試しましたか?それは素晴らしいデスクトップマークダウンエディターです。


非常に多くの依存関係。でも十分いい感じです!
dmeu 2013年

Mac OS XにreTextをインストールする方法についてのいくつかの情報はここにあります
lauhub

1
いくつかの依存関係を手動でインストールする必要がある場合があります:sudo apt-get install python3-docutils python3-
markdown

Ubuntu 15.04では、依存関係とMIMEタイプの関連付けの両方がすべて自動的にセットアップされます。
colan

1
@Moytabaはgithubに移動したようです:github.com/retext-project/retext
NuclearPeon

17

pandocは、Markdownのオフライン視覚化の問題を解決する、テキストからテキストへの変換ツールです。ちょうど発行:

pandoc -f markdown -t html README.md > README.html

これをインストールして、いくつかのファイルで使用しました。よく働く!
エドワード

14

MarkView Google Chrome拡張機能はかなり便利だと思いましたが、実際には魅力のように機能しています。

MarkViewは、アウトラインビューでマークダウンファイルを編集および表示するためのChrome拡張機能であり、複数のテーブル形式のスタイル、コードブロック構文のハイライト、Githubフレーバーマークダウンをサポートしています。

特徴:

  1. Webページスタイルでのマークダウンファイルの編集と表示。
  2. ファイルが変更されたときにローカルファイルを自動再読み込み(インストール後:chrome:// extensions /で[ファイルのURLへのアクセスを許可]オプションを選択
  3. スクロール可能な方法でコンテンツの横にアウトラインを表示します
  4. GoTop、ViewSource、GoBottomのボタンを用意する
  5. Githubフレーバーマークダウンテーブルスタイルとコードハイライトをサポートします。
  6. プログラミング言語のコード領域を強調表示します(例: `` `ruby)
  7. まともなOutlookでWebページの印刷をサポート(Chrome-> File-> Print ...)
  8. 対応:ウィンドウサイズが940pxより小さい場合、アウトラインセクションは自動的に非表示になります。940pxより大きいサイズに変更すると、アウトラインセクションが表示されます。
  9. MarkViewはraw.github.comの下にあるものを除くすべてのマークダウンファイルを表示します。そのサブドメインはソースのみを表示するためです。

MarkViewにはさらに多くの機能が追加されています。

  1. WYSIWYGマークダウンエディター
  2. テーマとコードスタイリングの選択
  3. サポート脚注1
  4. インスタントスライドプレゼンテーション
  5. ドキュメントのカスタムスタイル

    • テーマCSSを追加して選択
    • コードスタイルを追加して選択
    • CSSの記述、保存および実行

@swcoolより良い答えがあると思われる場合は、誰かを編集するのではなく、自分で作成してください。
Jason

@swcoolは上記のChrome拡張機能の作成者だと思います。彼はそれを更新しているだけですか?
mariomaric 2014

はい、私はこのChrome拡張機能の作成者です。拡張機能に新しい機能が追加されるたびに、上記の説明を更新します。この方法により、MarkViewを1つの質問の1つの回答場所に保持できます。はい、更新のみ。しかし、Stackoverflowシステムが私のアップデートを承認していないようだったので、私は止めなければなりません。@Jason
swcool


11

テキストをmdビューアおよびmdエディタとして使用できます。軽量ですっきりしています。 ここに画像の説明を入力してください


1
これは質の高いエディターです、headsupに感謝します!
Lea Hayes

23
無料ではありません:texts.io/purchase
TN。

4
Linuxでは使用できません。
jameshfisher 2014

4
私はこれが多くのmdファイルをかなり貧弱にレンダリングすることがわかりました。
Zv_oDD 2014

2
Macでは、いくつかの外部ツール「fandoc」を事前にインストールする必要があります。これは、特にOSのどこかにあることを知らないか、信頼していません。ラッパー自体(テキスト)の重量は約4MBで、外部ツールがなくても.mdレンダラーには大きすぎます...それほど印象的なアプリではありません。
Motti Shneor 16年

11

Geanyにマークダウンプラグインがあり、これは公平な仕事をし、サイドバーにMarkdownプレビューも提供します。Linux、Mac OS X、Windowsでも動作します。

これを使用するには、geanyをインストールしてから、geany-plugin-markdownパッケージをインストールして、プラグインマネージャーから選択します。


私はすべてにgeanyを使用しており、これが私が期待していた答えです:)
Rutrus

9

node.jsファイルウォッチャーとsocket.ioを使用してオフラインマークダウンビューアーをコーディングしたので、ブラウザーをlocalhostに向けて実行する./markdownviewer /path/to/README.mdと、websocketを使用してブラウザーにストリーミングされます。


きちんと。私はこれまでnode.jsに抵抗してきましたが、チェックアウトしたかったのですが、これはもっともな理由でした。スタイルは完璧ではありません。おそらく欠落しているgithub cssファイルをビューアで挿入する必要がありますか?
pduey

8

StackEditあります。オンラインでもオフラインでも機能します(ブラウザーのローカルストレージを使用します)。

DropboxやGoogleドライブに接続して、クラウドでホストされているファイルを表示することもできます。


4
ブラウザのストレージは非常に限られています。非常に限られています。
パセリエ

8

vimの人なら、vim-previewプラグインを試すことができます。~/.vim選択した方法でディレクトリにインストールするだけです。次に、vimでMarkdownファイルを:Preview開き、ブラウザーで新しいウィンドウを開いて最終結果を表示するコマンドを使用できます。


ありがとう!残念ながら、プラグインには組み込みのrubyインタープリターといくつかのgemが必要です。依存関係が多すぎる...
xverges

1
うん、ごめんなさい-私はそれを少し前にインストールしたので、ruby gemについて言及するのを忘れていました(将来の読者のために:上記に含めたプラグインのリンクは、その種のrubyに興味がある場合にこれに取り組む方法を説明しています) 。
Peter Diakumis、2015年

1
別のvimプラグイン、これはjavascriptを使用するもの:github.com/suan/vim-instant-markdown
matiasg

7

ストラップダウンを検討してください

ストラップダウンは、ブラウザーでマークダウンコンテンツをレンダリングするJavascriptベースのソリューションであり、オフラインでの表示に最適です。彼ら自身の説明から:

Strapdown.jsを使用すると、エレガントなMarkdownドキュメントを簡単に作成できます。サーバー側のコンパイルは必要ありません。

したがって、.mdマークダウンファイルの名前をに変更し.html、次のように囲みます。

<xmp theme="united" style="display:none;">
# Markdown content here
…
</xmp>
<script src="http://strapdownjs.com/v/0.2/strapdown.js"></script>

ブラウザで開くと、レンダリングされたHTMLが表示されます。追加ボーナス:テーマを簡単に変更できます。


5

MACの場合はMarkedを使用し、Windowsの場合はMuto-Markを使用します。どちらもGHスタイルシートをサポートしています。


+1:私はWindowsでMutoMarkを使用しています:1.非常に軽量(395KB)2.見やすいビューア3.検索機能(Ctr + F)4.すべての検索結果をハイライトします
Iman Mahmoudinasab

1
残念ながらファイルの関連付けをサポートしていないようです
draeron、2015年

4

OS Xの場合、Mouは非常に優れており、2つのGitHub CSSテーマが付属しています。


いいけどバギー。たとえば、ヘッダーマーク###を削除しても、WYSIWYGの部分にはそれがヘッダーとして表示されます。などなど、2分間で3〜4個のバグを見つけたと思います。
mojuba 2014

4

Haroopadをチェックしてください。これは本当に素晴らしい#markdownエディターです。これは無料で、複数のプラットフォームで利用できます。Mac OSXで試してみました。


多くのWYSIWYG編集者のこのレビューは、Haroopadが最良であると結論付けました。WindowsとMacでも利用できます。GitHubプロジェクトのwikiを編集するためにダウンロードしましたが、これまでのところかなり良いようです。
TonyG 2015年

4

MacOSXでうまく機能する最も単純なリソースの1つは、InkMarkにあるMarkdown Quick Lookプラグインです。これをOS X 10.9+にインストールした後、Finderでマークダウンファイルを選択し、スペースバーをタップするだけです。結果がGithubと100%相関しているかどうかはわかりませんが、結果は非常に良好で、邪魔にならない小さなオフラインビューアのみのソリューションになります。Mashableは、他のオプションが必要な場合は、78の異なるツールに関する記事も書いています。

Makrdown-QuickLook-Preview


1
これまでで最高の。ちょっとした呪いをかけるために、.mdファイルを選択してスペースをヒットした回数を数えることができます。サイド・バイ・サイドプレビューが編集のために作られただけた.mdファイルを読み込むときだけnuisenceですので- 。私はそれから"と『』覚書オープン、待ち時間、近い編集側だろう
Motti Shneor

4

ほとんどの場合の簡単な解決策:マークダウンをコピーして「クラウド」のビューアに貼り付けます。2つの選択肢があります。

  1. Dillinger.io
  2. ディンガス

インストールするものはありません!クロスプラットフォーム!クロスブラウザ!いつでもご利用いただけます!

短所:大きなファイル、標準のクラウドアプリケーションのセキュリティ問題で面倒な場合があります。


そしてもちろん、あなたはプレリリースドキュメントを証明する前に、全世界と共有しています...
Motti Shneor

3

Notepad ++のMarkdown Syntax Highlightingと呼ばれる拡張機能を使用できます。Githubで入手できます

ここに画像の説明を入力してください

インストール後、言語ドロップダウンに新しいオプションが表示されます インストール後、言語ドロップダウンに新しいオプションが表示されます


1
エキサイティング。Githubへのリンクを追加できますか?
スマンドリ14年

3
これは質問の答えにはなりません。目標は、最終結果を示すことであり、ソースではありません。
Deryck、2015年


2

RStudioはマークダウンファイルを処理し、それらをhtmlおよびpdfに変換できます。すでにお持ちの場合は、RStudio(Rプログラミング言語のIDEです)を使用できます。これは無料でオープンソースであり、Windows、Mac、Linuxで動作します。


1

Scribefireを使用できます Nextを。

これはMozilla Firefoxですブラウザープラグインです。拡張機能をインストールしてFirefoxを起動するだけです。ツールバーをカスタマイズし、それにScribefireショートカットを配置します。また、ブラウザプラグインであるため、Mac、Linux、Windowsで使用できます。

Markdownモードで書き込む場合Edit Codeは、Scribefireウィンドウからクリックするだけです。

今あなたの目的を達成するために、Edit Codeモードに行き、すべてのテキストをコピーしてあなたに貼り付けます.mdファイルにアップロードします。

これにはライブプレビュー機能はありません。切り替えてEdit CodeEdit Visuallyあなたのテキストをプレビューします。

私は自分のLinux Mintボックスでそれを使用しています:

ここに画像の説明を入力してください

ここに画像の説明を入力してください

更新:

それは2014年です。他の読者や研究者のためにここに他の素晴らしいツールを追加する必要があります。最近使用されたBrackets + Markdown Preview Extension


ブラケットが大好きです!!! スパムはありません、私は本当にそうします
a7omiton 2015


弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.