Clean install: HMR broken!

[vpiskunov]

When creating a new project, using Vue CLI 3, both in CLI and UI mode.
Then adding vue-cli-plugin-nativescript-vue.

HMR simply keeps reloading the whole app & relaunching.

File change detected. Starting incremental webpack compilation...
....webpack compilation details here....
Webpack compilation complete. Watching for file changes.
Webpack build done!
Preparing project...
Project successfully prepared (iOS)
Successfully transferred bundle.js on device C023E95A-72B0-46B7-AD24-4B7480318E72.
Restarting application on device C023E95A-72B0-46B7-AD24-4B7480318E72...
Successfully synced application org.nativescript.application on device C023E95A-72B0-46B7-AD24-4B7480318E72.

When adding useLegacyWorkflow: false in nsconfig.json it then loads changes but those don’t get applied until force-quitting the app on device & opening again?

Tried running:

• tns run ios using default webpack
• npm run debug:ios
• npm run serve:ios
• a custom option using npm run setup-webpack-config && tns run ios --hmr --env.development

This does not happen when setting up a new project using nativescript-vue/vue-cli-template, in which case HMR is perfect.

[jawa-the-hutt]

I've added a commit to the dev branch that will hopefully address this.

Create a new vue project as normal and then install and invoke like this to test this out:
npm install git+https://github.com/nativescript-vue/vue-cli-plugin-nativescript-vue/tree/dev
npm invoke vue-cli-plugin-nativescript-vue

Once we have some validation HMR appears to be working, i'll push to master and update the npm package.

[vpiskunov]

The command to test had incorrect URL to git/branch, and its vue invoke instead of npm invoke. To test use the following:
npm install git+https://github.com/nativescript-vue/vue-cli-plugin-nativescript-vue.git#dev vue invoke vue-cli-plugin-nativescript-vue

For anyone using this patch for the issue, if run into this:
TypeError: nsWebpack.getSourceMapFilename is not a function
It's due to other dependencies upgraded: vue-cli & cli-plugin-babel & cli-plugin-eslint. Try it on a new, clean project.

[vpiskunov]

Amazing! It worked on the clean project.

Another issue - possibly related - after installing the plugin, HMR is also broken on serve:web - due to the plugin installing an addition dependency webpack instance.

Symptoms:

[HMR] Waiting for update signal from WDS...
[HMR] Waiting for update signal from WDS...

& Page reload +RangeError on update:

Uncaught RangeError: Maximum call stack size exceeded
at hotAddUpdateChunk (VM4024 app.js:979)
at webpackHotUpdateCallback...

I've found the workaround, which is to create project, install plugin & then:

npm rm @vue/cli-service
npm i --save-dev @vue/cli-service

Perhaps it's a simple fix, by ensuring the plugin doesn't add a separate webpack dep in package.json? I'm just guessing, but think there's the assumption of webpack being already installed when project requires vue-cli.

[jawa-the-hutt]

Glad you got it mostly working. Sorry about giving you the incorrect link for the install. That's what get for trying to do it from my phone.

I'm not sure about why webpack would be doing that. We have webpack as a dev dependency of the plugin so it shouldn't be installing a second copy of it as far as I know.

Can you show me what you have globally installed: npm list -g --depth=0

[vpiskunov]

Global npm list:

├── @vue/cli@3.7.0
├── @vue/cli-init@3.7.0
├── babel-eslint@8.2.3
├── basys-cli@0.4.0
├── eslint@4.19.1
├── eslint-config-airbnb-base@12.1.0
├── eslint-config-standard@11.0.0
├── eslint-plugin-html@4.0.3
├── eslint-plugin-import@2.9.0
├── eslint-plugin-node@6.0.1
├── eslint-plugin-promise@3.7.0
├── eslint-plugin-standard@3.0.1
├── forever@0.15.3
├── ganache-cli@6.1.8
├── jshint@2.9.5
├── nativescript@5.4.0
├── node-gyp@3.6.2
├── npm@6.4.1
├── sails@1.0.1
├── supervisor@0.12.0
├── tns-platform-declarations@5.3.1
└── total.js@2.9.4

Though I think what's relevant is npm list inside project:

npm ls webpack
├─┬ @vue/cli-plugin-babel@3.8.0
│ └── webpack@4.28.4
├─┬ @vue/cli-plugin-eslint@3.8.0
│ └── webpack@4.28.4
├─┬ @vue/cli-service@3.8.0
│ └── webpack@4.28.4
├─┬ nativescript-dev-webpack@0.22.0
│ └── webpack@4.27.1
└── webpack@4.32.2

[vpiskunov]

Actually the workaround is not just reinstalling @vue/cli-service, but also webpack:

npm rm webpack
npm i --save-dev webpack@4.28.4
npm rm @vue/cli-service
npm i --save-dev @vue/cli-service

Notice webpack uses webpack**@4.28.4** - important to fix the issue.

Without the version specified, the issue persists.

During the installation, plugin adds following to package.json:
"webpack": "^4.29.6",

Which causes it to install @4.32.2. Before adding the plugin, there is no direct dependency in package.json (it's installed in vue/cli-service as a dep, using the @4.28.4)

After re-installing webpack & cli-service(sequence is important), npm ls webpack looks like this:

├─┬ @vue/cli-plugin-babel@3.8.0
│ └── webpack@4.28.4
├─┬ @vue/cli-plugin-eslint@3.8.0
│ └── webpack@4.28.4
├─┬ @vue/cli-service@3.8.0
│ └── webpack@4.28.4  deduped
├─┬ nativescript-dev-webpack@0.22.0
│ └── webpack@4.27.1
└── webpack@4.28.4

Notice the deduped

[jawa-the-hutt]

I was able to reproduce the issue and solve it via your method. Thanks for troubleshooting it and giving me a direction for a fix. However, probably not the best thing to have everyone need to do for each new project.

I've updated dev and I've pinned webpack to 4.28.4. I think this should fix the issue for new projects. Feel free to test out and confirm.

I think the underlying issue may be a webpack-dev-server or vue-hot-reload-api bug where it's not detecting the multiple webpack dependency versions that might happen in a project and the HMR is getting confused.

Long term what this means is that this project will need to try and make sure the version of webpack being included as a dev-dependency matches what the vue-cli is currently pinned to.

[vpiskunov]

Perhaps there might be a way to set the version, by first running a hook (pre-install or something?) to detect current vue-cli's webpack version?

this project will need to try and make sure the version of webpack being included as a dev-dependency matches what the vue-cli is currently pinned to.

Will test on #dev and let you know

[vpiskunov]

For some reason npm run serve:web spat out this:

 ERROR  Failed to compile with 1 errors3:37:57 PM

 error  in ./src/main.js

Module build failed (from ./node_modules/eslint-loader/index.js):
Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/canwego/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at /Users/vpiskunov/code/nativescript/canwego/node_modules/@vue/cli-service/lib/Service.js:80:7

That was when it ran from Vue UI. Not sure what caused it. First running serve:web was fine, but if ran serve:ios first, then this was triggered.

Tried adding --env.development --env.web to the serve:web command in package.json. Running from UI, still had that error. Then tried from CLI, error vanished. Then removed --env.development --env.web back from the serve:web and it's still working in CLI.

UI works too after refresh. No clues so far.

[vpiskunov]

Another thing - on the webpack dependency resolution, I'm suspecting the dual instance may occur as this plugin adds webpack to the project package.json, rather than it's own (node_modules/vue-cli-plugin-nativescript-vue/package.json).

Perhaps moving the dep inside might help?

[jawa-the-hutt]

I cannot reproduce the UI issue. However, I do know that with the UI, it will sometimes mess with the parameters being passed to the CLI behind the scenes. What you can do is tell the UI to not set the environment based on what it thinks it should be, but instead, to follow what's explicitly set in the npm script.

To do this:

1. Click the Parameters button next to the Run Task button.
2. In Specify env mode dropdown, choose (unset)
3. Click Save

All that said, I just pushed a commit to dev to move the webpack dependency out of the generated project and into the devDependencies of the plugin itself. Let's see if this is works as you suggested in your most recent comment.

[vpiskunov]

Same error keeps (UI bug)

Seems it's running vue-cli-service serve --mode development.web --dashboard - this is the same, even after I've used the (unset) in the dropdown.

Here's a full log:

$ vue-cli-service serve --mode development.web --dashboard
starting webConfig

 INFO  Starting development server...

clean-webpack-plugin: /Users/vpiskunov/code/nativescript/test-plugin-patch-dev/dist/**/* has been removed.

 12% building 20/22 modules 2 active ...server/node_modules/strip-ansi/index.jsError resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)

Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)
Error resolving webpackConfig Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)

 87% record chunks RecordIdsPlugin ERROR  Failed to compile with 1 errors4:11:45 PM

 error  in ./src/main.js

Module build failed (from ./node_modules/eslint-loader/index.js):
Error: You need to provide a target platform!
    at module.exports (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/vue-cli-plugin-nativescript-vue/index.js:116:11)
    at plugins.forEach (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:80:7)
    at Array.forEach (<anonymous>)
    at Service.init (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/lib/Service.js:79:18)
    at Object.<anonymous> (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/@vue/cli-service/webpack.config.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.exports.resolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-import-resolver-webpack/index.js:69:27)
    at v2 (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:94:23)
    at withResolver (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:99:16)
    at fullResolve (/Users/vpiskunov/code/nativescript/test-plugin-patch-dev/node_modules/eslint-module-utils/resolve.js:116:22)

 @ multi (webpack)-dev-server/client?http://192.168.1.34:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main


                                                                  

[vpiskunov]

But the HMR seems fixed(web)! no double message [HMR] and modules seem to reload correctly!

Hopefully last thing: eslint is angry on ~ being used in paths like import App from '~/App.vue' .

It's fine when @ is used, but `Unable to resolve path to module (import/no-unresolved.
Perhaps it's a separate issue, but I'm guessing there is some quick-fix you're using?

After installing latest #dev:
npm ls webpack
test-plugin-patch-dev@0.1.0 /Users/vpiskunov/code/nativescript/test-plugin-patch-dev
├─┬ @vue/cli-plugin-babel@3.8.0
│ └── webpack@4.28.4
├─┬ @vue/cli-plugin-eslint@3.8.0
│ └── webpack@4.28.4  deduped
├─┬ @vue/cli-service@3.8.0
│ └── webpack@4.28.4  deduped
└─┬ nativescript-dev-webpack@0.22.0
  └── webpack@4.27.1

[vpiskunov]

Ok, I went digging down the UI bug rabbit-hole.

The issue seems to be from the linter. Due to vue project's default settings of "lint on save", it runs the linter in any case where it starts the server, or a file has changed.

It's weird that it works sometimes - I'd be guessing there is a few invocation mechanisms for the linter.

Looking at package.json, npm run lint would call vue-cli-service lint without any options/env.

When I ran it directly npx vue-cli-service lint, it failed in the same style:

But when running npx vue-cli-service lint --mode development.web, it works fine.

I've just amended the lint option in package.json - works so far. Will re-confirm soon. If this is it, perhaps we need to add this to generator, to have
"lint": "vue-cli-service lint --mode development.web" in package.json

[jawa-the-hutt]

The webpackConfig error above is being generated from here:

vue-cli-plugin-nativescript-vue/index.js

Line 116 in 1fbbfe4

throw new Error('You need to provide a target platform!');

What that tells me is that for some reason for you, the UI is interfering with the env variable in some way. It's not happening to me, so there is something in your setup that I haven't accounted for when trying to parse out env.

I had just uncommented that error check out in the dev branch only as I thought things had been fixed that were previously causing this to fail. That error check is in the nativescript-dev-webpack project's Vue template so that is why I left it in. Long term, i'd like to have it there, but short term, I can comment it back out so that it's doesn't trip you up.

However, the better long term solution is to try and figure out why it's causing you an issue. Let me know if you are willing to continue to troubleshoot why it's failing that error check and I'll give you some guidance on what you can do to help me troubleshoot without you having to create a new project and install the dev branch everytime.