Github上のプロジェクトをローカル環境で再現できない

##前提、実現したい事

初歩的な質問で申し訳ありません。
以下のリンクにあるGithubプロジェクトをローカル環境で再現したいと思っていますが、正しく動作しません。

https://github.com/mindmup/mapjs

多分、以下のサイトのような形になると思います。
mindmup

しかし、私の環境では以下の状態です。

このプロジェクトはブラウザ側で、サーバー側は別のプロジェクトにあります。

ただ、今回はサーバー側はすでに別のマインドマップのライブラリで作っているため、ブラウザ側のみ再現できれば良いと考えています。

##エラー内容

ブラウザのconsoleを開くと、エラー内容は

JQuery is not defined
mapModel is not defined
Failed to load resource: net::ERR_FILE_NOT_FOUND

というエラーが合わせて13個ほど出ています。

プロジェクトには

Use mindmup-mapjs.min.js from the dist folder. This includes no third-party scripts, so make sure you're including the dependencies separately as well.

とあります。

多分、依存関係のファイルを正しく入れられなかったのが原因だと考えています。

途中の手順が間違っていると思うので、アドバイスいただけると幸いです。

npmやbrowserifyは普段使わないため、かなり初歩的な部分で躓いている可能性が高いと思います。

プロジェクトには依存関係のファイルをインストールする手順がありました。

npm install mindmup-mapjs
browserify -r mindmup-mapjs > mapjs.js
var MAPJS = require('mindmup-mapjs')

一応、npmやbrowserifyのコマンドは使えているのですが多分実行場所が間違っていたりすると思います。

以下のリンクのような形になったかと、その手順を教えていただければ大変うれしく思います。
mindmup

初歩的な質問で申し訳ありません。

行動規範の内容に同意します

回答1件

ベストアンサー

任意のフォルダで
npm install mindmup-mapjs
を実行してmindmapに必要なモジュールを取得してくる

そのまま
browserify -r mindmup-mapjs > mapjs.js
を実行して必要なモジュールをすべてmapjs.jsというファイルにまとめる

mapjs.jsは
var MAPJS = require('mindmup-mapjs')
をすることで使用することが出来ます。

実際に出来たmapjs.jsをrequireしてconsole.logに出力出来たので
どのように使用するかはわかりませんが動くとは思います

html
1<html> 
2<head></head> 
3<script type="text/javascript" src="mapjs.js"></script>
4<script type="text/javascript" src="jquery.min.js"></script>
5<script type="text/javascript">
6var MAPJS = require('mindmup-mapjs');
7console.log(MAPJS);
8</script> 
9<body> 
10</body> 
11</html>