Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Conflictingvue-loader versions on update to NS-Vue 3 & Vue 3 #1102

Open
@spiffytech

Description

@spiffytech

I've started a project using the Vue/TS template, and I'm trying to update to NativeScript-Vue 3 and Vue 3.

However, I can't run my app in the emulator: I get bizarre errors fromts-loader. Looking deeper, I see that @nativescript/webpack and nativescript-vue require different versions ofvue-loader. Maybe that's the root of my problem?

How should I resolve this?


I created a project withns create ReadStuffLater --vue --ts

Then I updated nativescript-vue -> 3.0.1 and vue -> 3.5.17.

I updatedapp.ts according tothe upgrade guide, andHome.vue to Vue 3 syntax.

vue-loader@15.9.8  └─ @nativescript/webpack@5.0.24 (requires ^15.0.0 <= 15.9.8)     └─ dev ReadStuffLater@workspace (requires ~5.0.24)vue-loader@17.4.2  └─ nativescript-vue@3.0.1 (requires ^17.4.2)     └─ ReadStuffLater@workspace (requires ~3.0.1)

app.ts:

import{createApp}from"nativescript-vue";importHomefrom"./components/Home.vue";constapp=createApp(Home);app.start();

Home.vue:

<template>  <Page>    <ActionBar>      <Labeltext="Home"/>    </ActionBar>    <GridLayout>      <Labelclass="info">        <FormattedString>          <Spanclass="fas"text.decode="&#xf135;"/>          <Span:text="message"/>        </FormattedString>      </Label>    </GridLayout>  </Page></template><script lang="ts">import {computed,defineComponent }from"nativescript-vue";exportdefaultdefineComponent({    setup() {const message=computed(()=>"Blank {N}-Vue app");return {message };    }  });</script><style scoped lang="scss">@import'@nativescript/theme/scss/variables/blue';// Custom styles.fas {@includecolorize($color: accent);  }.info {font-size:20;horizontal-align:center;vertical-align:center;  }</style>
$ ns run android --emulator...ERROR in ./app/components/Home.vue?vue&type=template&id=1858554c&scoped=true&ts=true (../../node_modules/@nativescript/webpack/dist/loaders/nativescript-worker-loader/i16:40:52 [18/30607]modules/ts-loader/index.js??clonedRuleSet-3.use[0]!../../node_modules/nativescript-vue/node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!../../node_modules/nativescript-vue/node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./app/components/Home.vue?vue&type=template&id=1858554c&scoped=true&ts=true)Module build failed (from ../../node_modules/ts-loader/index.js):TypeError: Cannot read properties of undefined (reading 'length')    at createSourceFile2 (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/typescript/lib/typescript.js:33380:52)    at parseSourceFileWorker (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/typescript/lib/typescript.js:33254:24)    at Object.parseSourceFile (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/typescript/lib/typescript.js:33077:20)    at createSourceFile (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/typescript/lib/typescript.js:32912:21)    at transpileWorker (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/typescript/lib/typescript.js:144453:22)    at Object.transpileModule (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/typescript/lib/typescript.js:144367:10)    at getTranspilationEmit (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/ts-loader/dist/index.js:418:74)    at successLoader (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/ts-loader/dist/index.js:38:11)    at Object.loader (/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/ts-loader/dist/index.js:23:5) @ ./app/components/Home.vue?vue&type=template&id=1858554c&scoped=true&ts=true 1:0-451 1:0-451 @ ./app/components/Home.vue 1:0-85 8:68-74 19:29-35 18:84-20:3 18:2-20:4 @ ./app/app.ts 4:0-41 8:22-26webpack 5.100.2 compiled with 1 error and 34 warnings in 507 msWebpack compilation complete. Watching for file changes.ERROR in ./app/app.ts:9:23TS2345: Argument of type 'typeof import("/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/vue/dist/vue")' is not assignable to parameter of type 'Component<any, any, any,ComputedOptions, MethodOptions, {}, any>'.  Type 'typeof import("/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/vue/dist/vue")' is not assignable to type 'ComponentOptions<any, any, any, ComputedOptions, MethodOptions, any, any, any, string, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>'.    Type 'typeof import("/home/spiffytech/Documents/bootspoon/readstufflater/node_modules/vue/dist/vue")' is not assignable to type 'ComponentOptionsBase<any, any, any, ComputedOptions, MethodOptions, any, any, any, string, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>'.      Types of property 'computed' are incompatible.        Type '{ <T>(getter: ComputedGetter<T>, debugOptions?: DebuggerOptions | undefined): ComputedRef<T>; <T, S = T>(options: WritableComputedOptions<T, S>, debugOptions?: DebuggerOptions | undefined): WritableComputedRef<...>; }' is not assignable to type 'ComputedOptions'.          Index signature for type 'string' is missing in type '{ <T>(getter: ComputedGetter<T>, debugOptions?: DebuggerOptions | undefined): ComputedRef<T>; <T, S = T>(options: WritableComputedOptions<T, S>, debugOptions?: DebuggerOptions | undefined): WritableComputedRef<...>; }'.     7 | //Vue.config.silent = !__DEV__     8 |  >  9 | const app = createApp(Home);       |                       ^^^^    10 | app.start();    11 |

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions


      [8]ページ先頭

      ©2009-2025 Movatter.jp