Redoc: Using Redoc standalone version

[brasseld]

Hello,

I was following your documentation at https://github.com/Rebilly/ReDoc#advanced-usage-of-standalone-version to use Redoc standalone version (from an AngularJS app).

I have imported Redoc:

import { Redoc } from 'redoc';

Then, I added the sample code from documentation:

Redoc.init('http://petstore.swagger.io/v2/swagger.json', {
        scrollYOffset: 50
      }, document.getElementById('swagger-container'))

Unfortunately, it always ends with a browser error:

TypeError: redoc_1.Redoc.init is not a function
    at ./src/components/documentation/page-swagger.component.ts.PageSwaggerComponent.controller.$onInit (main.js:358346)
    at main.js:85079
    at forEach (main.js:74963)
    at nodeLinkFn (main.js:85068)
    at compositeLinkFn (main.js:84368)
    at publicLinkFn (main.js:84233)
    at lazyCompilation (main.js:84647)
    at boundTranscludeFn (main.js:84411)
    at Object.controllersBoundTransclude [as transclude] (main.js:85171)
    at main.js:109033 undefined

Can you tell me what I'm doing wrong there ?

Thanks a lot for your amazing project!

[RomanHotsiy]

Try

import { init } from 'redoc';
// ...

init('http://petstore.swagger.io/v2/swagger.json', {
        scrollYOffset: 50
      }, document.getElementById('swagger-container'))

[brasseld]

Hi @RomanGotsiy

Thanks, but unfortunately, it does not the trick and the error message is the same as the previous one.

[RomanHotsiy]

What about this ?

import { init } from 'redoc/bundles/redoc.standalone.js';

[brasseld]

Now, the console is complaining about this import:

ERROR in ./node_modules/redoc/bundles/redoc.standalone.js
Module not found: Error: Can't resolve 'null' in '/Users/my-user/redoc/node_modules/redoc/bundles'
 @ ./node_modules/redoc/bundles/redoc.standalone.js 7:82-97
 @ ./src/components/documentation/page-swagger.component.ts
 @ ./src/management/management.module.ts
 @ ./src/index.ts

[RomanHotsiy]

Which version of ReDoc are you using?

[brasseld]

The latest: v2.0.0-alpha.41

[RomanHotsiy]

Ok. Could you create a minimal reproducible repo so I can check it out?

[brasseld]

The code is available from a public repository hosted on GitHub.

Here is a link to the specific file: https://github.com/gravitee-io/gravitee-management-webui/blob/redoc/src/components/documentation/page-swagger.component.ts#L21

It's not a "minimal reproducible repo" but perhaps it can give you some more clues about what is going wrong there....

[RomanHotsiy]

How to reproduce the issue?
What to run? Where to go?

[petetnt]

I have the same issue when trying to use init, small repro here:

https://codesandbox.io/s/0q50r5y2op

Neither:

import { init } from 'redoc/bundles/redoc.standalone.js';

nor

import { init } from 'redoc';

seem to work. (Nor does import { RedocStandalone } from 'redoc'; Redoc.init()). For some reason it just seems that the init command is not properly re-exported from src/standalone.

[RomanHotsiy]

OK. I looked into this now.

First, init is not supposed to be used in library mode, only in standalone. When using ReDoc as a library directly import components e.g. RedocStandalone.

RedocStandalone looks to be broken in 2.0.0-rc.2 but it should be OK in 2.0.0-rc.4.

Check out the CodeSandbox

[benbro]

How can we import redoc standalone? I'm not using react.
I'm getting an error with 2.0.0-rc.8-1 'Can't resolve 'null' in ...'

I've tried import with:

import { init } from 'redoc';

I've also tried directly using redoc in module exports:

module.exports = {
  entry: {
    redoc: './src/redoc.standalone.js',
  }
}

[anupsingh-anup]

I'm still facing this error. @RomanHotsiy

import { Redoc } from 'redoc';

Redoc.init('http://petstore.swagger.io/v2/swagger.json', {
        scrollYOffset: 50
      }, document.getElementById('swagger-container'))