Can't use macro in adonisjs v6

[adnanerlansyah403]

Hello everyone, can anyone help me out how to use macro in adonisjs v6. I've been following from this documentation:
https://docs.adonisjs.com/guides/extend-adonisjs#macros-and-getters

Everything is ok until I hit the api or endpoint and then I got such as response like this:

{
    "message": "response.error is not a function",
    "name": "TypeError",
    "status": 500,
    "frames": [
        {
            "file": "app/controllers/auth_controller.ts",
            "filePath": "d:/allproject/personal/api/warung-buneng/app/controllers/auth_controller.ts",
            "line": 13,
            "callee": "AuthController.me",
            "calleeShort": "me",
            "column": 29,
            "context": {
                "start": 8,
                "pre": "            const isAuth = await auth.use('api').check()\n            if(!isAuth) return response.error(\"Token is not valid\", 403)\n            const user = auth.use('api').user;\n            return response.success(user)\n        } catch (error) {",
                "line": "            return response.error('Token was already expired', 400)",
                "post": "        }\n\n    }\n\n}"
            },
            "isModule": false,
            "isNative": false,
            "isApp": true
        }
    ]
}

And this is my code on the extensions and app_provider files.

src/extensions.js

import { Response } from '@adonisjs/core/http'

declare module '@adonisjs/core/http' {
  interface Response {
    success(data: Object, message?: string): this
  }
}

declare module '@adonisjs/core/http' {
  interface Response {
    error(message: string, statusCode: number): this
  }
}

Response.macro('success', function (this: Response, data: Object, message = '') {
    this.ctx!.response.send({
      status: true,
      message: message,
      data: data ?? null
    });
    return this
})
  
Response.macro('error', function (this: Response, message: string, statusCode: number = 400) {
    this.ctx!.response.status(statusCode).send({
        status: false,
        message: message,
        data: null
    });
    return this
})

providers/app_provider.ts

export default class AppProvider {
    async boot() {
      await import('../src/extensions.js')
    }
}

[thetutlage]

Gave it a try and everything seems to be working fine for me.

Maybe instead of importing the src/extensions.js file inside the provider, you can register it as a preload file and then give it a try

[adnanerlansyah403]

What did you mean by preloading the file sir? Was this already on the documentation? could I see it, sir?

[sinh117801]

@adnanerlansyah403 What he mean is import file src/extensions.js in file .adonisrc.ts. Find preload and add follow:

preloads: [() => import('#start/routes'), () => import('#start/kernel'), () => import('./src/extensions.js')],

Hope this will help.

[sinh117801]

But @thetutlage , should the document make change to what you mentions? I also try to import macro in app provider but it's not working.

[LarvePoire]

@adnanerlansyah403 What he mean is import file src/extensions.js in file .adonisrc.ts. Find preload and add follow:

preloads: [
() => import('#start/routes'), 
() => import('#start/kernel'), 
() => import('./src/extensions.js')
],

Hope this will help.

@sinh117801 Thanks for the suggestion. I tried importing ./src/extensions.js into .adonisrc.ts under preloads and that actually fixed the issue. However, I feel like I got around a limitation. Why is this step not included in the official documentation? Should I expect any other surprises or similar problems?

[radiumrasheed]

Right, I also think the docs is unclear
I had to put the file in the preloads array of .adonisrc.ts for it to work

---

Also, I think it's worth mentioning that although the file src/extensions.ts itself is typescript, importing it as javascript is not a mistake