3

Please, let me know what information I can provide to better help troubleshoot this issue. As of right now, I've been reading up on webpack, comparing my webpack.config.js file, and random searches into the Google void.

Earlier this morning, I was running my NativeScript-vue project as expected. Made some changes, saved, tested, wash, rinse repeat. Then I tried a build and I got the following error message: 

Unable to apply changes on device: emulator-####. Error is: Nativescript-vue doesn't work without --bundle option. Please specify --bundle option to the command and execute it again..

I've been making edits in one .vue file -- I have not been tinkering with any other files, especially not configuration files.

What is causing this issue?
How can I resolve this issue?
Is there a more intelligent search I can do than pasting in the error message?

UPDATE:

As requested by @Estradiaz

I've been attempting to run the application with:
tns run android --bundle
(also tried with ios and got the same results)

I've built the project using both npm install and tns install

The only script I have in my package.json is:

"clean": "rm -rf node_modules/* && rm -rf hooks/* && rm -rf platforms/* && rm webpack.config.js && rm package-lock.json"

(just to nuke everything if/when new assets are being added)

Running TNS version #5.2.4

The terminal's output is:

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..

UPDATED UPDATE:

Estradiaz drops some great knowledge; however, my error was discovered to have come from when my nativescript-vue package updated to 2.1.0 from 2.0.2

Rolling back to 2.0.2 resolved my specific issue. Other devs have started to report similar issues: https://github.com/nativescript-vue/nativescript-vue/issues/454 and https://github.com/nativescript-vue/nativescript-vue/pull/361#issuecomment-474079850

Doug
  • 1,435
  • 1
  • 12
  • 26
  • How do you start your app? Tns or npm? Can you post the scripts? – Estradiaz Mar 18 '19 at 15:21
  • HI @Estradiaz thank you for getting back to me :) I've updated the question with more details -- I hope these are what you were looking for. – Doug Mar 18 '19 at 17:17
  • Seems OK - may i ask, never did this before and i am to lazy to test right now - just an idea - you used native components only? – Estradiaz Mar 18 '19 at 17:26
  • As best that I can determine, yes. nativescript-{orientation, theme-core, ui-listview, ui-sidedrawer, vue}, tns-core-modules, and vuex. And none of these are new additions to the project; i've been working on the UI layout for the past couple of days (which my assumption has been if i break UI then the screen won't show up, not that the build logic would fail) – Doug Mar 18 '19 at 17:29
  • Yeah - but i think this error happens when tns cant Interpret the code - imo either forgot to --bundle or the bundle is wrong - im in the phone right now will build one later and test if i can recreate – Estradiaz Mar 18 '19 at 17:52

3 Answers3

2

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.

Doug
  • 1,435
  • 1
  • 12
  • 26
1

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..

Estradiaz
  • 3,483
  • 1
  • 11
  • 22
  • Thank you so much! Weirdly, we found this as an issue with the latest release of nativescript-vue @2.1.0, from today -- rolling back to 2.0.2 resolved the issue. And it's looking like a lot of other devs are starting to encounter this too. https://github.com/nativescript-vue/nativescript-vue/issues/454 – Doug Mar 18 '19 at 20:12
  • *I've been making edits in one .vue file -- I have not been tinkering with any other files, especially not configuration files.* was a little missleading ^^ you are welcome :) – Estradiaz Mar 19 '19 at 09:04
  • Yeah. Sorry about that. It didn't occur to me that my nativescript-vue package was set to "latest". So when I blew everything away on a new build, I asked since I didn't change any version numbers that everything would have remained as they were. Sorry this was an impossible question unless I dumped my entire repo into the ticket. – Doug Mar 19 '19 at 11:22
1

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.

Igor R.
  • 897
  • 5
  • 14