Nest: [webpack start:hmr] SyntaxError: Unexpected token import on TypeORM entity files

Created on 29 Aug 2018  路  11Comments  路  Source: nestjs/nest

I'm submitting a...


[ ] Regression 
[x] Bug report
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead post your question on Stack Overflow.

Current behavior


When running npm run start:hmr (note that npm run webpack is running) on a project created with the CLI and containing a TypeORM entity file, I get the following error:

[Nest] 10906   - 2018-8-29 16:41:14   [TypeOrmModule] Unable to connect to the database. Retrying (6)... +3011ms
/mnt/c/********/src/records/record.entity.ts:1
(function (exports, require, module, __filename, __dirname) { import { Entity, Column, PrimaryGeneratedColumn, VersionColumn, CreateDateColumn,
UpdateDateColumn } from 'typeorm';
                                                              ^^^^^^

SyntaxError: Unexpected token import

Expected behavior

I would expect no errors. It seems like the entity file does not get compiled to JavaScript.

Minimal reproduction of the problem with instructions

  1. Create a new project with the Nest CLI
  2. Add TypeORM to the project
  3. Create a TypeORM entity file
  4. Run npm run webpack
  5. On another terminal run npm run start:hmr
  6. Observe the error

What is the motivation / use case for changing the behavior?

Environment


[System Information]
OS Version     : Linux 4.4
NodeJS Version : v8.11.4
NPM Version    : 6.4.0
[Nest Information]
typeorm version : 5.2.0
common version  : 5.0.0
core version    : 5.0.0

I am new to Nest so please excuse me If I am making a stupid mistake.
I was not able to find details in the documentation about hot reloading on a CLI project. Thanks!

Most helpful comment

Hi Guys,

I'm able to fix this issue by changing configuration in nodemon.json as below.

nodemon.json

{
  "watch": ["src"],
  "ext": "*",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "ts-node -r tsconfig-paths/register src/main.ts"
}

All 11 comments

I was able to fix this issue by configuring TypeORM inside my app's root module (instead of using a ormconfig.json file) and referencing my entities by class instead of by file as suggested in #711 .

Is this the correct way / is there some other better solution? Thanks.
If there is, I really think the docs should have a section on webpack + typeorm. I would like to help but I am totally new to Nest :)

My root module now:

import { Module } from '@nestjs/common';
import { TypeOrmModule } from '@nestjs/typeorm';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { RecordsModule } from './records/records.module';
import { Record } from './records/record.entity';

@Module({
  imports: [
    TypeOrmModule.forRoot({
      keepConnectionAlive: true,
      type: 'postgres',
      host: 'localhost',
      port: 5432,
      username: '***',
      password: '***',
      database: '***',
      synchronize: true, // TODO: Remove in production!
      entities: [ // Passing entities as class references so that webpack doesn't break
        Record
      ],
      migrations: [__dirname + '/migration/**/*.ts'],
      subscribers: [__dirname + '/subscriber/**/*.ts'],
    }),
    RecordsModule,
  ],
  controllers: [
    AppController,
  ],
  providers: [
    AppService,
  ],
})
export class AppModule {}

try change tsconfig.json -> compilerOptions -> target to es6 .

@whtiehack thanks but it was already set to es6.

The entities are loaded on the fly by the TypeOrm, and therefore, webpack doesn't that these paths should be treated differently than just plain literal strings. Your solution is the best available one so far.

Maybe a better workaround:

Write a loader like this and pass require('path/to/ormconfig.json') to TypeOrmModule.forRoot.

another option would be to create the ./src/orm.config.ts I have to import all the entities there and then add it in the main module.

app.module.ts

import { Module } from '@nestjs/common';
import { TypeOrmModule } from '@nestjs/typeorm';
import ormconfig from 'orm.config';
@Module({
  imports: [ 
      TypeOrmModule.forRoot(ormconfig),
  ]
})
export class AppModule {}

File orm.config.ts

import { EntityOne } from './entityone.entity';
import { EntityTwo } from './entitytwo.entity';
let ormconfig = {
            "type": "mysql",
            "host": "localhost",
            "port": 3306,
            "username": "your_user",
            "password": "**********",
            "database": "your_database",
            "entities": [EntityOne, EntityTwo], //<----include all 
            "synchronize": true
            };

export default ormconfig;

Hi Guys,

I'm able to fix this issue by changing configuration in nodemon.json as below.

nodemon.json

{
  "watch": ["src"],
  "ext": "*",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "ts-node -r tsconfig-paths/register src/main.ts"
}

Is there a reason why nodemon doesn't watch for changes to src and use ts-node?

Hi Guys,

I'm able to fix this issue by changing configuration in nodemon.json as below.

nodemon.json

{
  "watch": ["src"],
  "ext": "*",
  "ignore": ["src/**/*.spec.ts"],
  "exec": "ts-node -r tsconfig-paths/register src/main.ts"
}

thanks, worked for me

Hi,
Check this answer https://stackoverflow.com/a/50375317.
Worked for me and didn't have to list all entities in config.

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

menme95 picture menme95  路  3Comments

tronginc picture tronginc  路  3Comments

cojack picture cojack  路  3Comments

artaommahe picture artaommahe  路  3Comments

mishelashala picture mishelashala  路  3Comments