JavaScriptなどプログラミングに関する投稿をしています。開発環境をDockerを使って、素早く構築するための手順です。Dockerアプリを起動します。必要なファイルを作成Railsアプリ用のディレクトリを作って、そこに移動します。今回はmyappとしました。myappそして、作成したディレクトリに次の4つのファイルを以下の内容で作成します。/myappGemfileは現時点では、これだけです。railsはバージョン指定なしで、最新版がインストールされます。'rails'空のGemfile.lockを用意します。次のコマンドで上記ファイルを読み込み、Dockerコンテナ上に、Railsアプリケーションが作成されます。iamgeを作成します。buildデータベースの設定と作成DBの設定を以下のように、追加します。myapp_testそして、DBを作成するコマンドを実行します。Serverも起動します。upそして、http://localhost:3000にアクセスして、こちらのページが表示されたら、成功です。webサーバが正常に終了していない時に、次のようなログが出て、コンテナの起動に失敗することがあります。Exitingそのような時はpid情報を削除するために、次のコマンドを実行すると解決します。しなければいけません。Gemfileを更新したときは、次の2つのコマンドを実行する必要があります。buildこの手間をなんとかしたいのですが、現状できていません。実行した時に、以下のエラーが出たので対処した時のメモです。deviceは「デバイスに空き領域がありません」というエラーです。ディスクの消費が増えていきますので、不要なコンテナやイメージを削除する必要があります。次のように、コンテナもしくはイメージを確認をして、削除していきます。Docker環境にVue.jsを導入しましたので、その手順をメモしておきます。5.1からはwebpackerを使用することで、Vue.jsやReactなどのモダンなJSフレームワークを組み込むことができるようになりましたので、そちらを使っていきます。Node.js)をインストールします。$APP_HOME続いてdocker-compose.ymlです。webpackerコマンドが使えるようになりました。webpacker:installこれで以下のWebPack関連ファイルが生成されました。webpacker:install:vueこのコマンドでは以下のVue.js関連のファイルが生成されました。・app/javascript/app.vue(Vueコンポーネントファイル)・app/javascript/packs/hello_vue.js(エントリーポイントファイル)・config/webpack/loaders/vue.js(Vue.jsの環境設定ファイル)Vue.jsファイルのビルドそれでは、Vue.js関連のコンポーネントをJavascriptにコンパイルするため、bin/webpackコマンド実行しビルドします。‘postcss-preset-env’」のエラーが出た場合の対象法はこちら。upwebpack-dev-serverただ、今のままだとVue.js用のJSを変更するたびに、毎回bin/webpackを実行してコンパイルしなければいけません。JSを変更したらすぐに変更が反映されるように、devサーバーを設定しておきます。ルートディレクトリにProcfile.devというファイルを以下のように作成します。./bin/webpack-dev-server次に、binディレクトリの下にserverという名前のファイルを以下のように作成します。Procfile.devまた、serverではforemanを使うので、Gemfileに追加します。serverとwebpack-dev-serverを一度に起動できます。'foreman'endconfig/environments/development.rbに以下を追加します。"http://localhost:8080"それらに合わせてdocker-compose.ymlを修正します。‘null’.」とエラーが出たのでその対処です。bootstrap_node.js:612:3解決方法こちらのissuesにあがっていました。webpack-dev-server@^2.11.1を実行してみました。Vue.jsの環境構築を行なう際に、JSのコンパイルにbin/webpackを実行するとエラーが出て、手が止まってしまったので、その対処についてです。‘postcss-preset-env’」と出ました。いうプラグインを入れてやれとのことです。Facebook、Google、Exponent、Tildeによって開発されたJavaScriptパッケージマネージャーです。postcss-preset-envこれでコマンドが通るようになりました。