• ..

NextJS

    エディタを vim モードにする

    メニューの

    1. File
    2. Preferences
    3. CodeSandbox settings
    4. Editor
    5. VIM Mode

    にチェックを入れるだけです。

    チェックを入れた後リロードすると使えるはずです。

    テンプレート node 時のマシン

    2019年4月17日のものです。

    ディストリビューション

    cat /etc/issue
    # Debian GNU/Linux 9 \n \l

    ディストリビューションのバージョン

    cat /etc/debian_version
    # 9.8

    Linux

    uname -a
    # Linux sse-sandbox-m3822l0lzy 4.19.19-041919-generic #201901310331 SMP Thu Jan 31 08:33:47 UTC 2019 x86_64 GNU/Linux

    物理 CPU 数

    grep physical.id /proc/cpuinfo | sort -u | wc -l
    # 1

    CPU 毎のコア数

    grep cpu.cores /proc/cpuinfo | sort -u
    # cpu cores       : 4

    論理プロセッサーの数

    grep processor /proc/cpuinfo | wc -l
    # 8

    メモリ

    cat /proc/meminfo
    # MemTotal:       65745476 kB
    # MemFree:         4334840 kB
    # MemAvailable:   49611096 kB
    # Buffers:         2631364 kB
    # Cached:         31919416 kB
    # SwapCached:            0 kB
    # Active:         20479308 kB
    # Inactive:       26894180 kB
    # Active(anon):   12825372 kB
    # Inactive(anon):    52184 kB
    # Active(file):    7653936 kB
    # Inactive(file): 26841996 kB
    # Unevictable:           0 kB
    # Mlocked:               0 kB
    # SwapTotal:             0 kB
    # SwapFree:              0 kB
    # Dirty:             17008 kB
    # Writeback:             0 kB
    # AnonPages:      12822812 kB
    # Mapped:           787376 kB
    # Shmem:             55008 kB
    # Slab:           13095584 kB
    # SReclaimable:   11494812 kB
    # SUnreclaim:      1600772 kB
    # KernelStack:       64384 kB
    # PageTables:       129844 kB
    # NFS_Unstable:          0 kB
    # Bounce:                0 kB
    # WritebackTmp:          0 kB
    # CommitLimit:    32872736 kB
    # Committed_AS:   21929520 kB
    # VmallocTotal:   34359738367 kB
    # VmallocUsed:           0 kB
    # VmallocChunk:          0 kB
    # Percpu:           149888 kB
    # HardwareCorrupted:     0 kB
    # AnonHugePages:     26624 kB
    # ShmemHugePages:        0 kB
    # ShmemPmdMapped:        0 kB
    # CmaTotal:              0 kB
    # CmaFree:               0 kB
    # HugePages_Total:       0
    # HugePages_Free:        0
    # HugePages_Rsvd:        0
    # HugePages_Surp:        0
    # Hugepagesize:       2048 kB
    # Hugetlb:               0 kB
    # DirectMap4k:     5104848 kB
    # DirectMap2M:    61782016 kB
    # DirectMap1G:           0 kB

    ディスク容量

    df -h
    # Filesystem                                                            Size  Used Avail Use% Mounted on
    # overlay                                                               468G   67G  378G  15% /
    # tmpfs                                                                  64M     0   64M   0% /dev
    # tmpfs                                                                  32G     0   32G   0% /sys/fs/cgroup
    # 10.101.78.182:6789,10.111.227.230:6789,10.102.69.236:6789:/sse/cache  1.2T  139G  1.1T  12% /cache
    # /dev/rbd14                                                           1014M   49M  966M   5% /sandbox
    # /dev/md1                                                              468G   67G  378G  15% /etc/hosts
    # shm                                                                    64M     0   64M   0% /dev/shm
    # tmpfs                                                                  32G     0   32G   0% /proc/acpi
    # tmpfs                                                                  32G     0   32G   0% /proc/scsi
    # tmpfs                                                                  32G     0   32G   0% /sys/firmware

    sandbox.config.json の為の JSON Schema

    書きました。

    スキーマはunpkg.com/@nju33/json-schema/schemas/codesandbox/sandbox.config.jsonに置いてあります。(設定時は先に先の URL を使う必要があるので注意です)

    VSCode の設定

    コマンドパレットへ>Preferences: Open Settings (JSON)と入力し設定ファイルを開きます。そして中でjson.schemasへ以下のような設定をします。

    {
      "json.schemas": [
        {
          "fileMatch": ["sandbox.config.json"],
          "url": "https://unpkg.com/@nju33/json-schema/schemas/codesandbox/sandbox.config.json"
        },
      ]
    }

    設定はこれだけです。

    プロジェクトにあるsandbox.config.jsonファイルに対してチェックが走るようになるはずです。

    ターミナル上の環境変数

    CodeSandbox 上かどうか判断して処理を分けたかったので。

    printenv

    LS_COLORS=rs=0:di=01;34:ln=01;36:mh=00:pi=40;33:so=01;35:do=01;35:bd=40;33;01:cd=40;33;01:or=40;31;01:mi=00:su=37;41:sg=30;43:ca=30;41:tw=30;42:ow=34;42:st=37;44:ex=01;32:*.tar=01;31:*.tgz=01;31:*.arc=01;31:*.arj=01;31:*.taz=01;31:*.lha=01;31:*.lz4=01;31:*.lzh=01;31:*.lzma=01;31:*.tlz=01;31:*.txz=01;31:*.tzo=01;31:*.t7z=01;31:*.zip=01;31:*.z=01;31:*.Z=01;31:*.dz=01;31:*.gz=01;31:*.lrz=01;31:*.lz=01;31:*.lzo=01;31:*.xz=01;31:*.zst=01;31:*.tzst=01;31:*.bz2=01;31:*.bz=01;31:*.tbz=01;31:*.tbz2=01;31:*.tz=01;31:*.deb=01;31:*.rpm=01;31:*.jar=01;31:*.war=01;31:*.ear=01;31:*.sar=01;31:*.rar=01;31:*.alz=01;31:*.ace=01;31:*.zoo=01;31:*.cpio=01;31:*.7z=01;31:*.rz=01;31:*.cab=01;31:*.jpg=01;35:*.jpeg=01;35:*.mjpg=01;35:*.mjpeg=01;35:*.gif=01;35:*.bmp=01;35:*.pbm=01;35:*.pgm=01;35:*.ppm=01;35:*.tga=01;35:*.xbm=01;35:*.xpm=01;35:*.tif=01;35:*.tiff=01;35:*.png=01;35:*.svg=01;35:*.svgz=01;35:*.mng=01;35:*.pcx=01;35:*.mov=01;35:*.mpg=01;35:*.mpeg=01;35:*.m2v=01;35:*.mkv=01;35:*.webm=01;35:*.ogm=01;35:*.mp4=01;35:*.m4v=01;35:*.mp4v=01;35:*.vob=01;35:*.qt=01;35:*.nuv=01;35:*.wmv=01;35:*.asf=01;35:*.rm=01;35:*.rmvb=01;35:*.flc=01;35:*.avi=01;35:*.fli=01;35:*.flv=01;35:*.gl=01;35:*.dl=01;35:*.xcf=01;35:*.xwd=01;35:*.yuv=01;35:*.cgm=01;35:*.emf=01;35:*.ogv=01;35:*.ogx=01;35:*.aac=00;36:*.au=00;36:*.flac=00;36:*.m4a=00;36:*.mid=00;36:*.midi=00;36:*.mka=00;36:*.mp3=00;36:*.mpc=00;36:*.ogg=00;36:*.ra=00;36:*.wav=00;36:*.oga=00;36:*.opus=00;36:*.spx=00;36:*.xspf=00;36:
    SSE_MANAGER_PORT_80_TCP_PROTO=tcp
    YARN_VERSION=1.13.0
    HOSTNAME=sse-sandbox-e27v9
    KUBERNETES_PORT_443_TCP_PROTO=tcp
    KUBERNETES_PORT_443_TCP_ADDR=10.96.0.1
    SSE_MANAGER_PORT=tcp://10.103.12.151:80
    KUBERNETES_PORT=tcp://10.96.0.1:443
    PWD=/sandbox
    HOME=/home/sandbox
    SSE_MANAGER_PORT_80_TCP_ADDR=10.103.12.151
    KUBERNETES_SERVICE_PORT_HTTPS=443
    KUBERNETES_PORT_443_TCP_PORT=443
    NODE_VERSION=10.15.3
    KUBERNETES_PORT_443_TCP=tcp://10.96.0.1:443
    SSE_MANAGER_PORT_80_TCP_PORT=80
    TERM=xterm
    SSE_MANAGER_PORT_80_TCP=tcp://10.103.12.151:80
    SHLVL=1
    KUBERNETES_SERVICE_PORT=443
    PATH=/usr/local/bin:/usr/bin:/bin:/usr/local/games:/usr/games
    KUBERNETES_SERVICE_HOST=10.96.0.1
    SSE_MANAGER_SERVICE_HOST=10.103.12.151
    SSE_MANAGER_SERVICE_PORT=80
    _=/usr/bin/printenv

    if [ `echo $HOSTNAME | grep sandbox` ]; then
      # ...
    fi

    こんな感じの判定でいいかもです。

    Docsify へ埋め込む

    Docsify の埋め込み記法は使わない

    単純に「Share」ボタンからの<iframe ...をコピペするだけです。

    Docsify には[...](... ':include type:html')という外部URL上の*.html*.mdなどを埋め込める記法がありますが、これでは埋め込むことはできません。

    当たり前なんですが、上の記法のドキュメント読んだらそれに固執してしまい少しハマりました。