I have created a Js library that I want to use in some projects. It's not completely stable and has a few bugs I want to work on. But how is it meant to develop a library, when HMR does not work with dependencies? Use case:
vue create fooproject
, cd into that directory.npm install --save ~/tmp/vue-extensions # or where your lib lives
.npm run serve
- it compiles the Vue project and runs the dev webserver. Leave that terminal open.vue-extensions
library - just add a whitespace anywhere and save.vue-extensions
dir and run npm run build
- It should build the lib and return qith success.Module build failed (from ./node_modules/eslint-loader/index.js):
Error: ENOENT: no such file or directory, open '/home/christian/vue-extensionpoints/dist/vue-extensionpoints.common.js'
@ ./src/main.js 7:0-50 10:8-23
@ multi (webpack)-dev-server/client?http://192.168.4.3:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
This is no problem, just restart the build: npm run serve
And now is the problem: It breaks again, with many errors:
error: Unexpected newline between function and ( of function call (no-unexpected-multiline) at ../../Projekte/vue-extensionpoints/dist/vue-extensionpoints.common.js:88:10:
86 | /******/ })
87 | /************************************************************************/
> 88 | /******/ ({
| ^
89 |
90 | /***/ "06cf":
91 | /***/ (function(module, exports, __webpack_require__) {
error: 'exports' is defined but never used (no-unused-vars) at ../../Projekte/vue-extensionpoints/dist/vue-extensionpoints.common.js:135:25:
133 |
134 | /***/ "1d80":
> 135 | /***/ (function(module, exports) {
| ^
136 |
137 | // `RequireObjectCoercible` abstract operation
138 | // https://tc39.github.io/ecma262/#sec-requireobjectcoercible
error: 'exports' is defined but never used (no-unused-vars) at ../../Projekte/vue-extensionpoints/dist/vue-extensionpoints.common.js:370:25:
368 |
369 | /***/ "5135":
> 370 | /***/ (function(module, exports) {
| ^
371 |
372 | var hasOwnProperty = {}.hasOwnProperty;
373 |
error: 'exports' is defined but never used (no-unused-vars) at ../../Projekte/vue-extensionpoints/dist/vue-extensionpoints.common.js:417:25:
415 |
416 | /***/ "5c6c":
> 417 | /***/ (function(module, exports) {
| ^
418 |
419 | module.exports = function (bitmap, value) {
420 | return {
error: 'exports' is defined but never used (no-unused-vars) at ../../Projekte/vue-extensionpoints/dist/vue-extensionpoints.common.js:603:25:
[...and so on...]
Just break with Ctrl+C and run npm run serve
again, and it works.
A npm cache clear [--force]
does not help.
How the heck am I supposed to change a library and reload it with HMR when I ALWAYS have to rebuild the lib, and stop and restart the main server twice? This makes developement impossible, except you have too much time and patience for things like that.
There must be an (obviously) easier way to accomplish library developing, right?
Thanks in advance.
I hate it. Again. After days of struggle. Almost EVERY single time I post a question at Stackoverflow, I find the answer myself a few minutes later...
I just deleted the /dist/ folder in the lib. And it worked.