Nativescript-vue doesn't work without --bundle option
After some troubleshooting (and help from the tech lead), we tracked down that a new nativescript-vue
package was released today (going from 2.0.2 to 2.1.0).
In that, "feature" #361 is: "show error when --bundle option is not provided"
I don't know what this actually means in the scope of my project or how I was invoking the build or why it was breaking ... but rolling back to 2.0.2 resolved my issue.
Search the typo
the bugging history of code ;)
Without changes to the dev dependencies, the main reason for the "--bundle"
error is the use of a non native element - e.g. Lable instead Label
.
Following:
$ npm install -g @vue/cli @vue/cli-init$ vue init nativescript-vue/vue-cli-template <project-name>$ cd <project-name>$$ npm install$ # or$ yarn install$$ tns run android --bundle$ # or$ tns run ios --bundle
from: Quick Start
then - whilst running - make changes to ./app/components/App.vue
:
<template> <Page> <ActionBar title="Welcome to NativeScript-Vue!"/> <GridLayout columns="*" rows="*"> <Label class="message" :text="msg" col="0" row="0"/> </GridLayout> </Page></template>
to (html: div
):
<template> <Page> <ActionBar title="Welcome to NativeScript-Vue!"/> <GridLayout columns="*" rows="*"> <div id="hello"></div> </GridLayout> </Page></template>
or to (typo : Lable instead Label
):
<template> <Page> <ActionBar title="Welcome to NativeScript-Vue!"/> <GridLayout columns="*" rows="*"> <Lable class="message" :text="msg" col="0" row="0"/> </GridLayout> </Page></template>
one will recieve following error:
Webpack compilation complete. Watching for file changes. Webpack build done!
Unable to apply changes on device: emulator-5554. Error is: Nativescript-vue doesn't work without --bundle option. Please specify --bundle option to the command and execute it again..
There was a broken release of nativescript-vue
today (2.1.0
), which caused the issue you were experiencing. We have released 2.2.0
with the fix, so please make sure you are running the latest version.