taki["blog"] = 2022

社会人8年目(東京5年目)の日常

(作業途中) 実践Rust本Chapter 6の環境設定

背景

  • 実践Rust本を読もうとしたら,6章のcargo install cargo-generateがローカルのUbuntu環境で頑張ってもうまく突破できないのでなんとかする必要がある
  • Docker上で環境を作って,手元のUbuntuからDockerにVS Codeでつなぎたいな,という気持ちになっている

ローカルのVS Codeを整備

拡張機能dockerを適当にインストールすると,左側にクジラが出てくるので,見ると下でつくるubuntu18:04などが選べるので,そこにattachするとシェルが動く.細かい環境設定は後ほどやる (Dockerfileを作ってから?)

Dockerで環境を作成 (テスト)

これはローカルの環境 (Dockerはインストール済みとする).

$ docker pull ubuntu:18.04
$ docker run -it ubuntu:18.04 /bin/bash

ここはdockerにattachしたシェル上.

$ apt update
$ apt-get install curl build-essential
$ curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs/sh
$ export PATH=$PATH:$HOME/.cargo/bin
$ export USER=test
$ cd /tmp
$ cargo new hello
$ cd hello
$ cargo run

ここまで来て,Hello, world!を確認.

npmのインストール

これはdockerにattachしたシェル上.ここでexportとかいくつかコマンドがあるけど未メモ状態(面倒になった.nvm installしたら出てくる.3行ぐらい).

$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.35.3/install.sh | bash
$ # ここでいくつかのコマンド
$ nvm install --lts
$ npm --version

ここまで来て,npmのバージョン 6.14.6を確認 (書籍は6.14.4).

cargo-generateのインストール

これはdockerにattachしたシェル上で本の通り.

$ cargo install cargo-generate

これだけだと,openssl-devel関係のエラーが出ている.

f:id:takilog:20200914202811p:plain

ここでこちらのQiita記事を参考にする.

$ apt-get install libssl-dev
$ cargo install cargo-generate

これだけだと,OPENSSL_DIRが設定されてないぞ!のエラーメッセージが消えないので設定してもう一度やってみる.

$ export OPENSSL_LIB_DIR=/usr/lib/x86_64-linux-gnu/
$ export OPENSSL_INCLUDE_DIR=/usr/include/openssl/
$ cargo install cargo-generate

ここまででとりあえず,cargo install cargo-generateのBuilding (234/234) が完了したみたい.

cargo-generateで雛形作成

これはdockerにattachしたシェル上で本の通り.mandelbrotと入力すると作成されます.

# cargo generate --git https://github.com/rustwasm/wasm-pack-template

wasm-packのインストール

これはdockerにattachしたシェル上で本の通り.

$ curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh
$ cd mandelbrot
$ wasm-pack build

ここまで問題なく動作確認 (5分ぐらいかかったけど…).続いてWebアプリケーション作成部分.

$ npm init wasm-app www

ここでエラーが出ている (events.js:292).世の中のサイトを見ていると,gitがインストールされているか?というQ&Aがあったので,それを真似てgitをインストールしてからもう一度やる.

$ apt-get install git
$ npm init wasm-app www

カニが確認できた.

f:id:takilog:20200914205533p:plain

また本に戻ってWebアプリのインストールと起動.ただしwebpack-dev-server: not foundのエラーが出ているみたいなので,適当に検索してnpm install -g webpack-dev-serverをやってみる.-gはいらないかもしれない.また本に書いてあるとおり,よく脆弱性の警告が出てくる.とりあえずnpm audit fixも実行したけど,いらないかもしれない.

$ cd www/
$ npm install -g webpack-dev-server
$ npm install
$ npm run start

ここでコンテナ上で可動している雰囲気は分かった.

f:id:takilog:20200914205945p:plain

このDockerコンテナ上のlocalhostにアクセスしないといけない.dockerのアドレスをinspectで見ると,適当なローカルIPが着いているっぽいがうまく接続できなかった.仕方ないのでDockerfileにまとめるときになんとかした方が良いかもしれない.

ここまでの結論

面倒過ぎる…(何か間違ってそう)