bootstrap-vueインストール
front/Dockerfile
FROM node:14.15.4-alpine3.10
ENV APP_HOME /app
RUN mkdir -p $APP_HOME
WORKDIR $APP_HOME
RUN apk update
COPY package.json .
RUN npm install -g npm @vue/cli
+ RUN npm install vue bootstrap-vue bootstrap
ターミナル
$ docker-compose up -d
$ docker-compose ps
Name Command State Ports
--------------------------------------------------------------------------------------------
****_db_1 docker-entrypoint.sh mysqld Up 0.0.0.0:3306->3306/tcp, 33060/tcp
****_front_1 docker-entrypoint.sh npm r ... Up 0.0.0.0:8080->8080/tcp
****_web_1 bundle exec rails s -p 300 ... Up 0.0.0.0:3000->3000/tcp
$ docker-compose run front sh
/app # vue -V
@vue/cli 4.5.11
/app # node -v
v14.15.4
/app # vue add bootstrap-vue
...
? Use babel/polyfill? No
...
✔ Successfully invoked generator for plugin: vue-cli-plugin-bootstrap-vue
/app # exit
正しくインストールされたか確認
front/src/components/HelloWorld.vue
...
</ul>
<b-button variant="primary">Primary</b-button>
<b-button variant="secondary">Secondary</b-button>
<b-button variant="success">Success</b-button>
<b-button variant="danger">Danger</b-button>
<b-button variant="warning">Warning</b-button>
<b-button variant="info">Info</b-button>
<b-button variant="light">Light</b-button>
<b-button variant="dark">Dark</b-button>
</div>
</template>
...
localhost:8080
