Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Blueprint Starter Kit: Cannot read property '__extends' of undefined #3262

Closed
dylanswartz opened this issue Dec 28, 2018 · 12 comments
Closed

Comments

@dylanswartz
Copy link

Environment

  • Package version(s):
    classnames@^2.2
    dom4@^1.8
    react@^16.2.0/umd/react.production.min.js
    react-dom@^16.2.0/umd/react-dom.production.min.js
    react-transition-group@^2.2.1/dist/react-transition-group.min.js
    popper.js@^1.14.1/dist/umd/popper.js
    react-popper@^1.0.0/dist/index.umd.min.js
    @blueprintjs/core@^3.0.0
    @blueprintjs/icons@^3.0.0
  • Browser and OS versions:
    Chrome Browser: Version 71.0.3578.98 (Official Build) (64-bit)
    Mac OS 10.13.1

Steps to reproduce

  1. Head to blueprint getting started docs:
    https://blueprintjs.com/docs/#blueprint/getting-started
  2. Copy paste the example under CDN consumption into an index.html file
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Blueprint Starter Kit</title>
    <link href="https://unpkg.com/normalize.css@^7.0.0" rel="stylesheet" />
    <link href="https://unpkg.com/@blueprintjs/core@^3.0.0/lib/css/blueprint.css" rel="stylesheet" />
    <link href="https://unpkg.com/@blueprintjs/icons@^3.0.0/lib/css/blueprint-icons.css" rel="stylesheet" />
  </head>
  <body>
    <script src="https://unpkg.com/classnames@^2.2"></script> 
    <script src="https://unpkg.com/dom4@^1.8"></script> 
    <script src="https://unpkg.com/react@^16.2.0/umd/react.production.min.js"></script> 
    <script src="https://unpkg.com/react-dom@^16.2.0/umd/react-dom.production.min.js"></script> 
    <script src="https://unpkg.com/react-transition-group@^2.2.1/dist/react-transition-group.min.js"></script> 
    <script src="https://unpkg.com/popper.js@^1.14.1/dist/umd/popper.js"></script> 
    <script src="https://unpkg.com/react-popper@^1.0.0/dist/index.umd.min.js"></script> 
    <script src="https://unpkg.com/@blueprintjs/core@^3.0.0"></script> 
    <script src="https://unpkg.com/@blueprintjs/icons@^3.0.0"></script> 
 
    <div id="btn"></div>
    <script>
      const button = React.createElement(Blueprint.Core.Button, {
        icon: "cloud",
        text: "CDN Blueprint is go!",
      });
      ReactDOM.render(button, document.querySelector("#btn"));
    </script> 
  </body>
</html>
  1. Open index.html file in chrome or run in a local server like serve
  2. Observe the following exception in the console:
core.bundle.js:1 Uncaught TypeError: Cannot read property '__extends' of undefined
    at core.bundle.js:1
    at Object.<anonymous> (core.bundle.js:1)
    at n (core.bundle.js:1)
    at Object.<anonymous> (core.bundle.js:1)
    at n (core.bundle.js:1)
    at core.bundle.js:1
    at core.bundle.js:1
    at core.bundle.js:1
    at core.bundle.js:1

Actual behavior

The example Blueprint Quick Start for CDN consumption does not work. An exception is thrown in the console and no button renders on the screen.

Expected behavior

Running the Example Blueprint Quick Start in the browser should render a button and not throw exceptions.

Possible solution

I'm not sure. Seems like perhaps some dependency is missing 🤷‍♂️

@giladgray
Copy link
Contributor

@dylanswartz you are likely missing tslib, one of the declared dependencies.

@giladgray
Copy link
Contributor

can you confirm this ⬆️? may need to add another script tag to that example.

@dylanswartz
Copy link
Author

Tried adding:
<script src="https://unpkg.com/tslib@^1.9.3"></script>

Seem to still get the same error.

@giladgray
Copy link
Contributor

@dylanswartz did you add it before the blueprint js script tags?

@giladgray
Copy link
Contributor

ah hmm yup this is real! the example file does not work. just opened #3276 to fix.

@dylanswartz
Copy link
Author

Thanks @giladgray! Sorry for not replying seem to miss github notifications

@llchan
Copy link

llchan commented Jan 11, 2019

Are we sure this is fixed? I copied the example and I'm still seeing the same __extends error. Also the react-transition-group.min.js filename might need to be updated to react-transition-group.js.

@giladgray
Copy link
Contributor

giladgray commented Jan 11, 2019 via email

@llchan
Copy link

llchan commented Jan 11, 2019

I'm copying the example from the develop branch (1c89f7b) though, so I think that should reflect the changes from the merged PR.

More specifically, I'm copying from here.

@llchan
Copy link

llchan commented Jan 11, 2019

Oh, maybe you mean that a new blueprint bundle needs to be built and propagated to unpkg for it to work via CDN, not just that the docs/examples need to be updated. If that's the case I'll wait for the next release.

@giladgray
Copy link
Contributor

@llchan release was published late last week. check again!

@llchan
Copy link

llchan commented Jan 16, 2019

Blueprint stuff looks good now, thanks! Btw I think react-transition-group.min.js still needs to be pointed to the unminified version, but that's a diffferent issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants