showRoots false throws Module build failed

[brothatru]

Describe the bug
Setting showRoots to false in .storybook/manager.js crashes storybook's browser application.

To Reproduce

1. Install storybook 6.1.10
2. Copy and paste code from docs for disabling root hierarchy
3. Restart storybook (npm run storybook)
4. Browser application renders blank with console errors.
5. Also tried npm i -D @storybook/addons (same result)

Expected behavior
Root headings should disappear from application's sidebar

Screenshots

Code snippets

// ./storybook/manager.js

import { addons } from `@storybook/addons`;
addons.setConfig({ showRoots: false });

// ./storybook/main.js

const { TsconfigPathsPlugin } = require('tsconfig-paths-webpack-plugin');

module.exports = {
  stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
  addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
  webpackFinal: async (config) => {
    config.resolve.plugins.push(new TsconfigPathsPlugin({}));
    return config;
  },
};

System
Environment Info:

System:
OS: macOS 10.15.7
CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Binaries:
Node: 12.18.3 - /usr/local/bin/node
npm: 6.14.9 - /usr/local/bin/npm
Browsers:
Chrome: 87.0.4280.88
Safari: 14.0
npmPackages:
@storybook/addon-actions: ^6.1.10 => 6.1.10
@storybook/addon-essentials: ^6.1.10 => 6.1.10
@storybook/addon-links: ^6.1.10 => 6.1.10
@storybook/addons: ^6.1.10 => 6.1.10
@storybook/react: ^6.1.10 => 6.1.10

Additional context
Just installed today, went through documentation and trying things out...

[shilman]

The code is slightly wrong. It should be:

import { addons } from '@storybook/addons';

I'm updating the docs now

[brothatru]

Just to provide closure, was able to get this working after updating quotes and invalidating the cached manager.js.

start-storybook -p 6006 --no-manager-cache

More details about cached manager.js here ~ issue 13200.

[shilman]

cc @ghengeveld on the manager caching