Storybook: DevTools failed to load SourceMap

Created on 4 Feb 2020  路  6Comments  路  Source: storybookjs/storybook

Describe the bug
Warning in console:
DevTools failed to load SourceMap: Could not load content for http://localhost:6006/unfetch.mjs.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE.

To Reproduce

  1. Starting Storybook

Expected behavior
No warning.

Screenshots
If applicable, add screenshots to help explain your problem.
image

Code snippets
this my webpack.config.js

const webpack = require('webpack');
const _ = require('lodash');
const WebpackNotifierPlugin = require('webpack-notifier');
const WebpackShellPlugin = require('webpack-shell-plugin');
const FilterWarningsPlugin = require('webpack-filter-warnings-plugin');

module.exports = ({ config }) => {
  config.resolve.extensions.push('.ts', '.tsx', '.js', '.jsx', '.json');
  config.module.rules.push(
    {
      test: /\.tsx?$/,
      exclude: /node_modules/,
      use: [
        {
          loader: 'babel-loader',
          options: { cacheDirectory: true }
        },
        {
          loader: 'ts-loader',
          options: { transpileOnly: true }
        }
      ]
    },
    {
      test: /\.tsx?$/,
      exclude: /node_modules/,
      use: [
        {
          loader: '@storybook/addon-storysource/loader',
          options: { parser: 'typescript' }
        }
      ],
      enforce: 'pre'
    }
  );
  config.node = {
    fs: 'empty',
    path: 'empty'
  };
  _.remove(config.plugins, plugin =>
    ['DefinePlugin', 'ProgressPlugin'].includes(plugin.constructor.name)
  );
  config.plugins.push(
    new webpack.ProvidePlugin({ React: 'react' }),
    new webpack.DefinePlugin({
      'process.env.LAUNCHER': JSON.stringify(process.env.LAUNCHER)
    }),
    new webpack.WatchIgnorePlugin([/\.jsx?$/, /\.d\.ts$/]),
    new FilterWarningsPlugin({
      // unable to re-export
      exclude: /export .* was not found in .*/
    }),
    new WebpackNotifierPlugin({ title: 'storybook' }),
    new WebpackShellPlugin({
      onBuildEnd: [
        'chrome.exe ' + `http://localhost:${process.env.STORYBOOK_PORT}`
      ]
    })
  );
  return config;
};

System:

Environment Info:

  System:
    OS: Windows 10 10.0.18362
    CPU: (8) x64 Intel(R) Core(TM) i7-6820HK CPU @ 2.70GHz
  Binaries:
    Node: 10.18.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.17.3 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.13.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.18362.449.0

compatibility with other tools inactive question / support

Most helpful comment

@Eventyret I have same warning, yes it's adblock.

All 6 comments

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!

I have an issue. My react project is rendered partially instead of on full screen
Screenshot (1)
Screenshot (2)

after deploying to firebase hosting, my react project was rendered partially instead of full screen; i got this error when i console logged:
DevTools failed to load SourceMap: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.postload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME

after deploying to firebase hosting, my react project was rendered partially instead of full screen; i got this error when i console logged:
DevTools failed to load SourceMap: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/include.postload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME

Isn't that your adblocker? "gighmmpiobklfepjocnamgkkbiglidom" in chrome web store will suggestion this @Oscar-Everest
Try to turn it off to possible see if it affects it.

@Eventyret I have same warning, yes it's adblock.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

moimikey picture moimikey  路  67Comments

Gongreg picture Gongreg  路  58Comments

43081j picture 43081j  路  61Comments

ChucKN0risK picture ChucKN0risK  路  74Comments

hckhanh picture hckhanh  路  69Comments