aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.36k stars 2.1k forks source link

codegen models import results in errors #13311

Open michael-trinity opened 2 weeks ago

michael-trinity commented 2 weeks ago

Before opening, please confirm:

JavaScript Framework

Vue

Amplify APIs

DataStore

Amplify Version

v6

Amplify Categories

Not applicable

Backend

Amplify CLI

Environment information

``` # Put output below this line System: OS: Windows 10 10.0.19045 CPU: (32) x64 AMD Ryzen 9 5950X 16-Core Processor Memory: 35.34 GB / 63.91 GB Binaries: Node: 20.8.0 - C:\Program Files\nodejs\node.EXE npm: 10.2.0 - C:\Program Files\nodejs\npm.CMD pnpm: 8.8.0 - ~\AppData\Local\pnpm\pnpm.EXE Browsers: Edge: Chromium (123.0.2420.97) Internet Explorer: 11.0.19041.4355 npmPackages: ini: ^1.3.5 => 1.3.8 (4.1.1) inquirer: ^6.5.1 => 6.5.2 nuxt: ^3.11.2 => 3.11.2 vue: ^3.4.21 => 3.4.26 vue-router: ^4.3.0 => 4.3.2 npmGlobalPackages: @aws-amplify/cli: 12.7.0 @sparticuz/chromium: 118.0.0 aws-cdk: 2.102.0 corepack: 0.20.0 npm: 10.2.0 pm2: 5.3.1 puppeteer-core: 21.6.1 puppeteer: 21.6.1 ```

Describe the bug

When using amplify codegen models and importing them into my code it will result in an error

export * from './builder';
  ^^^^^^

  SyntaxError: Unexpected token 'export'
  at internalCompileFunction (node:internal/vm:128:18)
  at wrapSafe (node:internal/modules/cjs/loader:1280:20)
  at Module._compile (node:internal/modules/cjs/loader:1332:27)
  at Object..js (node:internal/modules/cjs/loader:1427:10)
  at Module.load (node:internal/modules/cjs/loader:1206:32)
  at Function._load (node:internal/modules/cjs/loader:1022:12)
  at Module.require (node:internal/modules/cjs/loader:1231:19)
  at require (node:internal/modules/helpers:179:18)
  at Object.<anonymous> (node_modules/@aws-amplify/data-schema/src/runtime/client/index.ts:14:27)
  at Module._compile (node:internal/modules/cjs/loader:1369:14)

This is my full grapql schema generated by Amplify Studio

  enum SongOrigin {
  YOUTUBE
  UPLOAD
}

type PlaylistSong @model @auth(rules: [{allow: public, operations: [read]}, {allow: private, provider: iam, operations: [create, read, update, delete]}, {allow: private, operations: [read]}]) {
  id: ID!
  song: Song @belongsTo
  playlist: Playlist @belongsTo
  order: Int
  playlistID: ID! @index(name: "byPlaylist")
  songID: ID! @index(name: "bySong")
}

type SongRequest @model @auth(rules: [{allow: public, operations: [create, read]}, {allow: private, provider: iam, operations: [create, read, update, delete]}, {allow: private, operations: [read]}]) {
  id: ID!
  song: Song @belongsTo
  requestedOn: AWSDateTime
  playlistID: ID! @index(name: "byPlaylist")
  songID: ID! @index(name: "bySong")
}

type Artist @model @auth(rules: [{allow: public, operations: [read]}, {allow: private, provider: iam, operations: [create, read, update, delete]}, {allow: private, operations: [read]}]) {
  id: ID!
  name: String!
  albums: [Album] @hasMany
  songs: [Song] @hasMany
}

type Playlist @model @aws_cognito_user_pools @auth(rules: [{allow: owner}, {allow: public, operations: [read, create]}, {allow: private, provider: iam}, {allow: private, operations: [read]}]) {
  id: ID!
  name: String!
  isNormalized: Boolean!
  hasCountdown: Boolean!
  hasFadeIn: Boolean!
  hasFadeOut: Boolean!
  allowSuggestions: Boolean!
  minimumSnippetLength: Int!
  maximumSnippetLength: Int!
  songs: [PlaylistSong] @hasMany(indexName: "byPlaylist", fields: ["id"])
  songRequests: [SongRequest] @hasMany(indexName: "byPlaylist", fields: ["id"])
  currentSongIndex: Int
  currentSongPlayhead: Int
  isPlaying: Boolean
}

type Song @model @auth(rules: [{allow: private, provider: iam}, {allow: public}, {allow: private, operations: [read]}]) {
  id: ID!
  name: String!
  duration: Int
  description: String
  filePath: String
  start: Int
  end: Int
  songOrigin: SongOrigin
  playlists: [PlaylistSong] @hasMany(indexName: "bySong", fields: ["id"])
  album: Album @belongsTo
  artist: Artist @belongsTo
  songRequests: [SongRequest] @hasMany(indexName: "bySong", fields: ["id"])
}

type Album @model @auth(rules: [{allow: public, operations: [read]}, {allow: private, provider: iam, operations: [create, read, update, delete]}, {allow: private, operations: [read]}]) {
  id: ID!
  name: String!
  songs: [Song] @hasMany
  artist: Artist @belongsTo
}

However if I just use Artist and then generate the models it will work

  type Artist @model @auth(rules: [{allow: public, operations: [read]}, {allow: private, provider: iam, operations: [create, read, update, delete]}, {allow: private, operations: [read]}]) {
  id: ID!
  name: String!
}

I will include the files that work and don't work that are generated

models-works.zip models-dontwork.zip

Expected behavior

When using codegen on a schema made with studio it should properly work when importing them to use with DataStore

Reproduction steps

  1. Create new amplify project with gql api
  2. Use the provided schema
  3. Generate models
  4. try to import the models into nodejs using modules (I'm using Nuxt3 that has it on by default)

Code Snippet

// Put your code below this line.
import {Artist} from "~/src/models";

Log output

``` // Put your logs below this line ERROR [worker reload] [worker init] Unexpected token 'export' 7:05:18 AM export * from './builder'; ^^^^^^ SyntaxError: Unexpected token 'export' at internalCompileFunction (node:internal/vm:128:18) at wrapSafe (node:internal/modules/cjs/loader:1280:20) at Module._compile (node:internal/modules/cjs/loader:1332:27) at Object..js (node:internal/modules/cjs/loader:1427:10) at Module.load (node:internal/modules/cjs/loader:1206:32) at Function._load (node:internal/modules/cjs/loader:1022:12) at Module.require (node:internal/modules/cjs/loader:1231:19) at require (node:internal/modules/helpers:179:18) at Object. (node_modules/@aws-amplify/data-schema/src/runtime/client/index.ts:14:27) at Module._compile (node:internal/modules/cjs/loader:1369:14) ```

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

chrisbonifacio commented 4 days ago

Hi @michael-trinity , thanks for raising this issue 👋

I tried deploying a Gen 1 amplify app with the schema that was described not to work, enabled DataStore, generated models, and imported the models in my front end code but was not able to reproduce the issue.

can you share a bit more about where you are importing the models in your Vue app?

Or, would you be able to provide a small sample repo with a Vue app that reproduces the issue consistently? The error message unfortunately doesn't provide enough info to infer what about the schema might be causing an issue.