filenameHashing generates different hashes when build is run in different folders

[gklittlejohn]

Version

5.0.4

Reproduction link

github.com

Environment info

Environment Info:

  System:
    OS: Windows 10 10.0.19042
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
  Binaries:
    Node: 16.13.2 - C:\Program Files\nodejs\node.EXE
    Yarn: 3.0.2 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Spartan (44.19041.423.0), Chromium (100.0.1185.36)
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1
    @vue/babel-helper-vue-transform-on:  1.0.2
    @vue/babel-plugin-jsx:  1.1.1
    @vue/babel-plugin-transform-vue-jsx:  1.2.1
    @vue/babel-preset-app:  5.0.4
    @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:  5.0.4
    @vue/cli-plugin-babel: ~5.0.0 => 5.0.4
    @vue/cli-plugin-eslint: ~5.0.0 => 5.0.4
    @vue/cli-plugin-router:  5.0.4
    @vue/cli-plugin-vuex:  5.0.4
    @vue/cli-service: ~5.0.0 => 5.0.4
    @vue/cli-shared-utils:  5.0.4
    @vue/component-compiler-utils:  3.3.0
    @vue/web-component-wrapper:  1.3.0
    eslint-plugin-vue: ^8.0.3 => 8.6.0
    vue: ^2.6.14 => 2.6.14
    vue-eslint-parser:  8.3.0
    vue-hot-reload-api:  2.3.4
    vue-loader:  17.0.0 (15.9.8)
    vue-style-loader:  4.1.3
    vue-template-compiler: ^2.6.14 => 2.6.14
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

1. Create a new vue project using the vue create.
2. Run npm install and npm run build.
3. Copy the project to another folder
4. Run npm install and npm run build in the new folder.

What is expected?

The output of both builds to be identical.

What is actually happening?

In dist/js folder of the original project:

13,439 app-legacy.7a0997ea.js

19,094 app-legacy.7a0997ea.js.map

13,511 app.f9fe8d15.js

19,637 app.f9fe8d15.js.map

131,082 chunk-vendors-legacy.b2985fc5.js

689,301 chunk-vendors-legacy.b2985fc5.js.map

80,554 chunk-vendors.5405343c.js

420,490 chunk-vendors.5405343c.js.map

In dist/js folder of the copied project:

13,439 app-legacy.7b76f303.js

19,094 app-legacy.7b76f303.js.map

13,511 app.f9fe8d15.js

19,637 app.f9fe8d15.js.map

131,082 chunk-vendors-legacy.7f90cd79.js

689,301 chunk-vendors-legacy.7f90cd79.js.map

80,554 chunk-vendors.5405343c.js

420,490 chunk-vendors.5405343c.js.map

[benderl]

I also noticed this issue on my project. Seems like vue-loader uses an absolute path to generate import names.

/***/ "./src/views/DebugConfig.vue":
/*!***********************************!*\
  !*** ./src/views/DebugConfig.vue ***!
  \***********************************/
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {

eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _DebugConfig_vue_vue_type_template_id_b0addeaa__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./DebugConfig.vue?vue&type=template&id=b0addeaa */ \"./src/views/DebugConfig.vue?vue&type=template&id=b0addeaa\");\n/* harmony import */ var _DebugConfig_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DebugConfig.vue?vue&type=script&lang=js */ \"./src/views/DebugConfig.vue?vue&type=script&lang=js\");\n/* harmony import */ var _opt_openWB_dev_settings_test_openwb_ui_settings_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./node_modules/vue-loader/dist/exportHelper.js */ \"./node_modules/vue-loader/dist/exportHelper.js\");\n\n\n\n\n;\nconst __exports__ = /*#__PURE__*/(0,_opt_openWB_dev_settings_test_openwb_ui_settings_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(_DebugConfig_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"], [['render',_DebugConfig_vue_vue_type_template_id_b0addeaa__WEBPACK_IMPORTED_MODULE_0__.render],['__file',\"src/views/DebugConfig.vue\"]])\n/* hot reload */\nif (false) {}\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (__exports__);\n\n//# sourceURL=webpack://openwb-ui-settings/./src/views/DebugConfig.vue?");

/***/ }),

The string _opt_openWB_dev_settings_test_openwb_ui_settings_node_modules_vue_loader_dist_exportHelper_js represents the absolute path in my dev envorinment: /opt/openwb-dev/settings-test/openwb-ui-settings

As a result the hashes of the generated files are different even if the source is identical.

[hongdaDu]

+1