Description
Version
4.5.10
Environment info
Docker
Environment Info:
System:
OS: Linux 4.15 Alpine Linux
CPU: (2) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Binaries:
Node: 14.15.3 - /usr/local/bin/node
Yarn: 1.22.5 - /usr/local/bin/yarn
npm: 6.14.9 - /usr/local/bin/npm
Browsers:
Chrome: Not Found
Firefox: Not Found
npmPackages:
@kazupon/vue-i18n-loader: ^0.5.0 => 0.5.0
@vue/babel-helper-vue-jsx-merge-props: 1.2.1
@vue/babel-helper-vue-transform-on: 1.0.0
@vue/babel-plugin-jsx: 1.0.0
@vue/babel-plugin-transform-vue-jsx: 1.2.1
@vue/babel-preset-app: 4.5.10
@vue/babel-preset-jsx: 1.2.4
@vue/babel-sugar-composition-api-inject-h: 1.2.1
@vue/babel-sugar-composition-api-render-instance: 1.2.4
@vue/babel-sugar-functional-vue: 1.2.2
@vue/babel-sugar-inject-h: 1.2.2
@vue/babel-sugar-v-model: 1.2.3
@vue/babel-sugar-v-on: 1.2.3
@vue/cli-overlay: 4.5.10
@vue/cli-plugin-babel: ^4.5.10 => 4.5.10
@vue/cli-plugin-eslint: ^4.5.10 => 4.5.10
@vue/cli-plugin-router: 4.5.10
@vue/cli-plugin-vuex: 4.5.10
@vue/cli-service: ^4.5.10 => 4.5.10
@vue/cli-shared-utils: 4.5.10
@vue/component-compiler-utils: 3.2.0
@vue/preload-webpack-plugin: 1.1.2
@vue/web-component-wrapper: 1.2.0
eslint-plugin-vue: ^6.2.2 => 6.2.2
vue: ^2.6.12 => 2.6.12
vue-eslint-parser: 7.1.1
vue-hot-reload-api: 2.3.4
vue-i18n: ^8.22.3 => 8.22.3
vue-loader: 15.9.6 (16.1.2)
vue-style-loader: 4.1.2
vue-template-compiler: ^2.6.12 => 2.6.12
vue-template-es2015-compiler: 1.9.1
vuex: ^3.6.0 => 3.6.0
npmGlobalPackages:
@vue/cli: 4.5.9
Steps to reproduce
We are running vuecli environment inside a docker container.
We are mounting a host folder to the destination folder (dist) in our docker-compose.
package.json:
"scripts": {
"build-docker": "vue-cli-service build --mode 'development' --watch --dest dist
}
docker-compose.yml:
volumes:
- ./templates/_generated/frontend-vue/dist/:/app/dist
Now build via:
vue-cli-service build --mode 'development' --watch --dest dist
What is expected?
We expected that all the files and folders inside the "dist" folder are removed. Similar to
cd dist && rm -rf *
What is actually happening?
The dist folder itself is removed, not just its contents.
This subtle difference is a problem when you have a docker mount specifically on that dist folder.
Because removing this dist folder from within the container breaks the mount and then the built files are not visible on the host anymore. You need a container restart. This all breaks a smooth development flow in this particular scenario.
Our current workaround is to add a --no-clean and do a rm -rf dist/* initially.
But this does not work with the --watch option, as it is only done once initially.
package.json:
"scripts": {
"build-docker": "rm -rf dist/* && vue-cli-service build --mode 'development' --watch --dest dist --no-clean",
}