API resource content not rendering on local dev server

[jeff-matthews]

Mac OS X v10.11.6
Chrome v54
node v6.9.1
npm v3.10.8
petstore swagger.yaml (from the ReDoc repo)

After cloning the repo and installing dependencies, I ran npm start and got this error:

> Invalid configuration object. webpack-dev-server has been initialised using a configuration object that does not match the API schema.
>      - configuration has an unknown property 'outputPath'.

After deleting that object per this, I get new errors when I run npm start:

> ERROR in ./lib/index.ts
> 
>     Module not found: Error: Can't resolve 'style' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'style-loader' instead of 'style'.
>      @ ./lib/index.ts 2:0-55
>      @ multi redoc
> 
>     ERROR in ./lib/vendor.ts
>     Module not found: Error: Can't resolve 'style' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'style-loader' instead of 'style'.
>      @ ./lib/vendor.ts 23:0-40
>      @ multi vendor
> 
>     ERROR in ./lib/vendor.ts
>     Module not found: Error: Can't resolve 'style' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'style-loader' instead of 'style'.
>      @ ./lib/vendor.ts 24:0-33
>      @ multi vendor
> 
>     ERROR in ./lib/vendor.ts
>     Module not found: Error: Can't resolve 'style' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'style-loader' instead of 'style'.
>      @ ./lib/vendor.ts 22:0-44
>      @ multi vendor
> 
>     ERROR in ./lib/components/Redoc/redoc.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/Redoc/redoc.ts 88:21-44
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/ApiInfo/api-info.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/ApiInfo/api-info.ts 25:21-47
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/ApiLogo/api-logo.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/ApiLogo/api-logo.ts 23:21-47
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/JsonSchema/json-schema.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/JsonSchema/json-schema.ts 126:21-50
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/ParamsList/params-list.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/ParamsList/params-list.ts 64:21-50
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/RequestSamples/request-samples.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/RequestSamples/request-samples.ts 56:21-54
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/ResponsesSamples/responses-samples.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/ResponsesSamples/responses-samples.ts 54:21-56
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/ResponsesList/responses-list.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/ResponsesList/responses-list.ts 64:21-53
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/SchemaSample/schema-sample.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/SchemaSample/schema-sample.ts 128:21-52
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/SideMenu/side-menu.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/SideMenu/side-menu.ts 77:21-48
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/MethodsList/methods-list.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/MethodsList/methods-list.ts 39:21-51
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/Method/method.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/Method/method.ts 60:21-45
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/Warnings/warnings.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/Warnings/warnings.ts 30:21-47
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/components/SecurityDefinitions/security-definitions.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/components/SecurityDefinitions/security-definitions.ts 41:21-59
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/shared/components/DropDown/drop-down.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/shared/components/DropDown/drop-down.ts 26:21-48
>      @ ./lib/shared/components/index.ts
>      @ ./lib/components/RequestSamples/request-samples.ts
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/shared/components/Zippy/zippy.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/shared/components/Zippy/zippy.ts 55:21-44
>      @ ./lib/shared/components/index.ts
>      @ ./lib/components/RequestSamples/request-samples.ts
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc
> 
>     ERROR in ./lib/shared/components/Tabs/tabs.ts
>     Module not found: Error: Can't resolve 'sass' in '/Users/jeff/git/ReDoc'
>     BREAKING CHANGE: It's no longer allowed to omit the '-loader' prefix when using loaders.
>                      You need to specify 'sass-loader' instead of 'sass'.
>      @ ./lib/shared/components/Tabs/tabs.ts 66:21-43
>      @ ./lib/shared/components/index.ts
>      @ ./lib/components/RequestSamples/request-samples.ts
>      @ ./lib/components/index.ts
>      @ ./lib/index.ts
>      @ multi redoc

So, I go into webpack.dev.js and append "-loader":

test: /\.ts$/,
     loaders: [
       'awesome-typescript-loader',
       'angular2-template-loader'
     ],
     exclude: [/\.(spec|e2e)\.ts$/]
    }, {
     test: /lib[\\\/].*\.scss$/,
     loaders: ['raw-loader', "sass-loader"],
     exclude: [/redoc-initial-styles\.scss$/]
    }, {
     test: /\.scss$/,
     loaders: ['style-loader', 'css-loader', "sass-loader"],
     exclude: [/lib[\\\/](?!.*redoc-initial-styles).*\.scss$/]
    }, {
     test: /\.css$/,
     loaders: ['style-loader', 'css-loader'],
    }, {
     test: /\.html$/,
     loader: 'raw-loader'
    }]

Now when I run npm start, I don't get any errors, but when I open localhost:9000, I can't see or navigate to any API resources in the table of contents (e.g., PET, STORE, USER) or scroll past the Authentication section. I only see the front matter preceding the API resources.'

Did I break it when I appended "-loader"?

[RomanHotsiy]

@jeff-matthews does it print anything to browser console?

[jeff-matthews]

@RomanGotsiy Sorry, I'm away from my main development machine, but I was able to reproduce on another system:

ubuntu v16.04
node v7.20
npm v3.5.2
chrome v54

Same result in browser. I've attached console output.
localhost-1479865220583.txt

[RomanHotsiy]

@jeff-matthews Thank you. I will fix this asap

[RomanHotsiy]

@jeff-matthews I've just updated webpack configs and stick angular version to 2.1 minor until I update to the latest.

Pull the latest changes and reinstall node_modules (rm -rf node_modules && npm install) and try again.
It should work now.

[jeff-matthews]

@RomanGotsiy Yep! It works now. I'm looking forward to using ReDoc. Thanks for all your hard work on this project.