Skip to content

Manual install failed! #9

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

Closed
dhirschfeld opened this issue Feb 2, 2017 · 28 comments
Closed

Manual install failed! #9

dhirschfeld opened this issue Feb 2, 2017 · 28 comments

Comments

@dhirschfeld
Copy link
Contributor

On win64/py35. I cloned the repo. Ran npm install in both extension directories and then installed and enabled both extensions. AFAICS everything seemed to work, however when trying to display a plot in the notebook it doesn't display and I get the below error in the console:
image

Any idea what could be wrong?

@dhirschfeld
Copy link
Contributor Author

Also running notebook 4.3.1 and jupyterlab 0.15.0

@dhirschfeld
Copy link
Contributor Author

When I list the extension it sees that its available but also has a weird message X has entry point in manifest:

λ jupyter labextension list
Known labextensions:
config dir: C:\Python\envs\py-dev\etc\jupyter
    jupyterlab_plotly enabled : C:\Python\envs\py-dev\share\jupyter\labextensions\jupyterlab_plotly
        X has entry point in manifest

@gnestor
Copy link
Owner

gnestor commented Feb 11, 2017

I see errors like this when the extension is installed but the Javascript didn't build correctly. Try running bash build.sh in the project root and verify that webpack succeeded.

@dhirschfeld
Copy link
Contributor Author

I'm on win64 so that's unlikely to work! I'll retry the manual steps and keep an eye out for any errors or warnings...

@gnestor
Copy link
Owner

gnestor commented Feb 11, 2017

Sorry, how UNIX-centric of me! I am currently refactoring the mimerender-cookiecutter to use setup.py to install and build extensions, so they will not depend on bash after next week.

@gnestor
Copy link
Owner

gnestor commented Feb 11, 2017

In the meantime, just run npm install (which should also run npm run build) in both the nbextension and labextension directories (although it sounds like you already did that, but watch for build errors)! A note of that Cannot find module: jupyterlab_plotly_react: That module is located in the component directory and both extensions have an npm preinstall script that run npm install ../component. The reason why the package.jsons don't depend on the component directory directly is because @jupyterlab/extension-builder does dependency validation and breaks with a ../component vs. a version number.

@dhirschfeld
Copy link
Contributor Author

dhirschfeld commented Feb 12, 2017

Hmm, tried it again and I got the below error

    ERROR in ./~/jupyterlab_plotly_react/index.js
    Module parse failed: C:\dev\code\jupyterlab_plotly\nbextension\node_modules\jupyterlab_plotly_react\index.js Unexpected token (28:6)
    You may need an appropriate loader to handle this file type.
    SyntaxError: Unexpected token (28:6)

The offending code in index.js:

  render() {
    const { layout } = this.getFigure();
    const style = {};
    if (layout && layout.height && !layout.autosize) style.height = layout.height;
    return (
      <div style={style} ref={(el) => { 
        this.el = el; 
      }} />
    );
  }

Will nuke it and try from scratch...

...same error after

git clean -xdf
git fetch upstream
git reset --hard upstream/master
npm install

@dhirschfeld
Copy link
Contributor Author

dhirschfeld commented Feb 12, 2017

Earlier in the build log I'm getting some git errors:

npm info git [ 'clone',
npm info git   '--template=C:\\Users\\dhirschf\\AppData\\Roaming\\npm-cache\\_git-remotes\\_templates',
npm info git   '--mirror',
npm info git   'git://github.com/mapbox/mapbox-gl-shaders.git',
npm info git   'C:\\Users\\dhirschf\\AppData\\Roaming\\npm-cache\\_git-remotes\\git-github-com-mapbox-mapbox-gl-shaders-git-de2ab007455aa2587c552694c68583f94c9f2747-c1710375' ]
npm info git [ 'clone',
npm info git   '--template=C:\\Users\\dhirschf\\AppData\\Roaming\\npm-cache\\_git-remotes\\_templates',
npm info git   '--mirror',
npm info git   'git://github.com/mapbox/mapbox-gl-style-spec.git',
npm info git   'C:\\Users\\dhirschf\\AppData\\Roaming\\npm-cache\\_git-remotes\\git-github-com-mapbox-mapbox-gl-style-spec-git-83b1a3e5837d785af582efd5ed1a212f2df6a4ae-fe7202af' ]
npm ERR! git clone --template=C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror git://github.com/mapbox/mapbox-gl-shaders.git C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\git-github-com-mapbox-mapbox-gl-shaders-git-de2ab007455aa2587c552694c68583f94c9f2747-c1710375: Cloning into bare repository 'C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\git-github-com-mapbox-mapbox-gl-shaders-git-de2ab007455aa2587c552694c68583f94c9f2747-c1710375'...
npm ERR! git clone --template=C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror git://github.com/mapbox/mapbox-gl-shaders.git C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\git-github-com-mapbox-mapbox-gl-shaders-git-de2ab007455aa2587c552694c68583f94c9f2747-c1710375: fatal: read error: Invalid argument
npm info git [ 'config', '--get', 'remote.origin.url' ]
npm info git [ 'fetch', '-a', 'origin' ]
npm ERR! git clone --template=C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror git://github.com/mapbox/mapbox-gl-style-spec.git C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\git-github-com-mapbox-mapbox-gl-style-spec-git-83b1a3e5837d785af582efd5ed1a212f2df6a4ae-fe7202af: Cloning into bare repository 'C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\git-github-com-mapbox-mapbox-gl-style-spec-git-83b1a3e5837d785af582efd5ed1a212f2df6a4ae-fe7202af'...
npm ERR! git clone --template=C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror git://github.com/mapbox/mapbox-gl-style-spec.git C:\Users\dhirschf\AppData\Roaming\npm-cache\_git-remotes\git-github-com-mapbox-mapbox-gl-style-spec-git-83b1a3e5837d785af582efd5ed1a212f2df6a4ae-fe7202af: fatal: read error: Invalid argument

...which are due to the use of the git:// protocol rather than https://. I can't see where that's coming from though so not sure how to tell npm/git to clone using https

@dhirschfeld
Copy link
Contributor Author

The git issue seems fixed by the advice give in the troubleshooting guide:
https://github.com/npm/npm/wiki/Troubleshooting#npm-only-uses-git-and-sshgit-urls-for-github-repos-breaking-proxies

...but it appears I'm still getting the parse error for index.js

@gnestor
Copy link
Owner

gnestor commented Feb 12, 2017

Ok, the ERROR in ./~/jupyterlab_plotly_react/index.js error suggests a couple things:

  • ./~/jupyterlab_plotly_react/index.js: ./~/ looks suspicious because the path should be ./node_modules/jupyterlab_plotly_react/index.js. This may be Windows-related...
  • You may need an appropriate loader to handle this file type. SyntaxError: Unexpected token (28:6): This is webpack tripping on the JSX syntax in the React component. Webpack requires babel-loader in order to parse and transpile it, and the webpack.config.js file correctly does that (babel-loader, etc. are listed as devDendencies in the package.json). However, if the file to be compiled by webpack is outside the webpack directory like that ./~/ suggests that it is, then webpack won't apply the loaders to it (at least that's what I've observed from my experience). So let's figure out why we're seeing that ./~/ and go from there.

@dhirschfeld
Copy link
Contributor Author

This may be Windows-related...

I'm sure it probably is :/ Thanks for having a look anyway - I don't know enough (any!) JS to really figure it out for myself. In case it's of use I've provided greater context to the above error:

> [email protected] prepublish C:\dev\code\jupyterlab_plotly\nbextension
> npm run build

npm info it worked if it ends with ok
npm info using [email protected]
npm info using [email protected]
npm info ok
npm info it worked if it ends with ok
npm info using [email protected]
npm info using [email protected]
npm info lifecycle [email protected]~prebuild: [email protected]
npm info lifecycle [email protected]~build: [email protected]

> [email protected] build C:\dev\code\jupyterlab_plotly\nbextension
> webpack

Hash: 50cb77bcedd5557961ff8d1670a6451f8e567d76fb7f42d844a0c75a6dc3
Version: webpack 1.14.0
Child
    Hash: 50cb77bcedd5557961ff
    Version: webpack 1.14.0
    Time: 1217ms
               Asset     Size  Chunks             Chunk Names
        extension.js  2.98 kB       0  [emitted]  main
    extension.js.map  3.25 kB       0  [emitted]  main
        + 3 hidden modules
Child
    Hash: 8d1670a6451f8e567d76
    Version: webpack 1.14.0
    Time: 3417ms
           Asset    Size  Chunks             Chunk Names
        index.js  759 kB       0  [emitted]  main
    index.js.map  885 kB       0  [emitted]  main
        + 185 hidden modules

    ERROR in ./~/jupyterlab_plotly_react/index.js
    Module parse failed: C:\dev\code\jupyterlab_plotly\nbextension\node_modules\jupyterlab_plotly_react\index.js Unexpected token (28:6)
    You may need an appropriate loader to handle this file type.
    SyntaxError: Unexpected token (28:6)
        at Parser.pp$4.raise (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:2221:15)
        at Parser.pp.unexpected (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:603:10)
        at Parser.pp$3.parseExprAtom (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1822:12)
        at Parser.pp$3.parseExprSubscripts (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1715:21)
        at Parser.pp$3.parseMaybeUnary (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1692:19)
        at Parser.pp$3.parseExprOps (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1637:21)
        at Parser.pp$3.parseMaybeConditional (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1620:21)
        at Parser.pp$3.parseMaybeAssign (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1597:21)
        at Parser.pp$3.parseParenAndDistinguishExpression (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1861:32)
        at Parser.pp$3.parseExprAtom (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1796:19)
        at Parser.pp$3.parseExprSubscripts (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1715:21)
        at Parser.pp$3.parseMaybeUnary (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1692:19)
        at Parser.pp$3.parseExprOps (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1637:21)
        at Parser.pp$3.parseMaybeConditional (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1620:21)
        at Parser.pp$3.parseMaybeAssign (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1597:21)
        at Parser.pp$3.parseExpression (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1573:21)
        at Parser.pp$1.parseReturnStatement (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:839:33)
        at Parser.pp$1.parseStatement (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:699:34)
        at Parser.pp$1.parseBlock (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:981:25)
        at Parser.pp$3.parseFunctionBody (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:2105:24)
        at Parser.pp$3.parseMethod (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:2075:10)
        at Parser.pp$1.parseClassMethod (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1137:25)
        at Parser.pp$1.parseClass (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1118:14)
        at Parser.pp$3.parseExprAtom (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1813:19)
        at Parser.pp$3.parseExprSubscripts (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1715:21)
        at Parser.pp$3.parseMaybeUnary (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1692:19)
        at Parser.pp$3.parseExprOps (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1637:21)
        at Parser.pp$3.parseMaybeConditional (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1620:21)
        at Parser.pp$3.parseMaybeAssign (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1597:21)
        at Parser.pp$1.parseExport (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\acorn\dist\acorn.js:1164:23)
     @ ./src/renderer.js 17:31-65
Child
    Hash: fb7f42d844a0c75a6dc3
    Version: webpack 1.14.0
    Time: 1841ms
           Asset     Size  Chunks             Chunk Names
        index.js  3.28 kB       0  [emitted]  main
    index.js.map  3.85 kB       0  [emitted]  main
        + 2 hidden modules
npm info lifecycle [email protected]~postbuild: [email protected]
npm info ok
npm info lifecycle [email protected]~prepare: [email protected]
[email protected] C:\dev\code\jupyterlab_plotly\nbextension
`-- (empty)

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN [email protected] No repository field.
npm WARN [email protected] No license field.
C:\dev\code\jupyterlab_plotly\nbextension [master ≡]

@dhirschfeld
Copy link
Contributor Author

The module parse lied does seem to reference the right path?

Module parse failed: C:\dev\code\jupyterlab_plotly\nbextension\node_modules\jupyterlab_plotly_react\index.js Unexpected token (28:6)

@gnestor
Copy link
Owner

gnestor commented Feb 13, 2017

Ok, so then it sounds like the babel-loader module may not be installed. Check if C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader exists. You can also try npm ls --depth=0 in the nbextension directory. Mine looks like:

[email protected] /Users/grant/Sites/jupyter/jupyterlab_plotly/nbextension
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] extraneous
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] extraneous
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
└── [email protected]

@dhirschfeld
Copy link
Contributor Author

Hmm, that folder does exist and babel-loader shows up in my npm ls:

λ npm ls --depth=0
npm info it worked if it ends with ok
npm info using [email protected]
npm info using [email protected]
npm info ok
npm info it worked if it ends with ok
npm info using [email protected]
npm info using [email protected]
[email protected] C:\dev\code\jupyterlab_plotly\nbextension
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected] extraneous
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected] extraneous
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

npm ERR! extraneous: [email protected] C:\dev\code\jupyterlab_plotly\nbextension\node_modules\core-js
npm ERR! extraneous: [email protected] C:\dev\code\jupyterlab_plotly\nbextension\node_modules\jupyterlab_plotly_react

@dhirschfeld
Copy link
Contributor Author

There seems to be a lot of noise on the web about this problem:
babel/babel-loader#198
webpack/webpack#2462

...but nothing I've tried including downgrading to the latest LTS node release has helped :/

@gnestor
Copy link
Owner

gnestor commented Feb 13, 2017

It sounds like in both threads, it works when running with Node 5.x and doesn't work with Node 6.x (unless they remove node_modules and reinstall). Why Node version are you running?

This comments looks like it could be relevant: webpack/webpack#2462 (comment)

@dhirschfeld
Copy link
Contributor Author

Yeah, I tried Node versions 5.12.0, 6.9.5 LTS, 7.4.0 and 7.5.0 all with the same result :(

I tried creating a .babelrc:

{
  "presets": [
    "latest",
    "stage-0",
    "react",
  ]
}

...and changing test: /\.js$/, to test: /\.jsx?$/, which (as I suspected) made no difference.

I can't see anything that's obviously wrong but don't know enough to tell.

What part of webpack/webpack#2462 (comment) are you referring to? I saw the comments about using path.resolve(__dirname, 'app') rather than concatenating with + but I can't see any __dirname or string concatenation going on in your config?

@gnestor
Copy link
Owner

gnestor commented Feb 14, 2017

@dhirschfeld Thanks for your persistence here. Ok, have you had issues getting other mimerender extensions to work? Is this only affecting nbextensions? Or labextensions as well?

I just created a branch that you can checkout and try: https://github.com/gnestor/jupyterlab_plotly/tree/windows-fix. I has 2 potential fixes:

  • Replace all explicit paths in webpack.config.js with path.resolve(PATH). path.resolve will normalize paths for the environment, so it will use backslashes for Windows.
  • Require the babel presets (vs. just referencing them by name). Babel looks for modules in the local node_modules directory (with a leading "babel-preset-" in the name) by default, but if your CWD/PWD is messed up (which Webpack's Acorn Dependency Choking on JSX on Node 6.0+ (Babel-Loader Not Being Loaded Correctly?) webpack/webpack#2462 (comment) referred to), then this could fix that. The fact that webpack is choking on JSX suggests that babel-preset-react is not working (because babel cannot transpile JSX without it).

@dhirschfeld
Copy link
Contributor Author

Thanks a lot for trying to fix my problem! Sorry it took a while to test the branch - busy day today. Unfortunately no joy, but it's a different error so hopefully it means there's progress...

<SNIP>
> [email protected] prepublish C:\dev\code\jupyterlab_plotly\nbextension
> npm run build

npm info it worked if it ends with ok
npm info using [email protected]
npm info using [email protected]
npm info ok
npm info it worked if it ends with ok
npm info using [email protected]
npm info using [email protected]
npm info lifecycle [email protected]~prebuild: [email protected]
npm info lifecycle [email protected]~build: [email protected]

> [email protected] build C:\dev\code\jupyterlab_plotly\nbextension
> webpack

Hash: 38676e142b406727d0b8c452e266d146e3c89a2058b5e61b712803155160
Version: webpack 1.14.0
Child
    Hash: 38676e142b406727d0b8
    Version: webpack 1.14.0
    Time: 313ms
        + 1 hidden modules

    ERROR in ./src/extension.js
    Module build failed: TypeError: Cannot read property '__esModule' of null
        at C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:299:104
        at Array.map (native)
        at OptionManager.resolvePresets (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
        at OptionManager.mergePresets (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
        at OptionManager.mergeOptions (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
        at OptionManager.init (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
        at File.initOptions (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\index.js:216:65)
        at new File (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\index.js:139:24)
        at Pipeline.transform (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
        at transpile (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader\lib\index.js:36:20)
        at Object.module.exports (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader\lib\index.js:128:12)
Child
    Hash: c452e266d146e3c89a20
    Version: webpack 1.14.0
    Time: 297ms
        + 1 hidden modules

    ERROR in ./src/index.js
    Module build failed: TypeError: Cannot read property '__esModule' of null
        at C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:299:104
        at Array.map (native)
        at OptionManager.resolvePresets (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
        at OptionManager.mergePresets (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
        at OptionManager.mergeOptions (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
        at OptionManager.init (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
        at File.initOptions (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\index.js:216:65)
        at new File (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\index.js:139:24)
        at Pipeline.transform (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
        at transpile (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader\lib\index.js:36:20)
        at Object.module.exports (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader\lib\index.js:128:12)
Child
    Hash: 58b5e61b712803155160
    Version: webpack 1.14.0
    Time: 281ms
        + 1 hidden modules

    ERROR in ./src/embed.js
    Module build failed: TypeError: Cannot read property '__esModule' of null
        at C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:299:10
4
        at Array.map (native)
        at OptionManager.resolvePresets (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\op
tions\option-manager.js:275:20)
        at OptionManager.mergePresets (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
        at OptionManager.mergeOptions (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
        at OptionManager.init (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
        at File.initOptions (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\index.js:216:65)
        at new File (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\file\index.js:139:24)
        at Pipeline.transform (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
        at transpile (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader\lib\index.js:36:20)
        at Object.module.exports (C:\dev\code\jupyterlab_plotly\nbextension\node_modules\babel-loader\lib\index.js:128:12)
npm info lifecycle [email protected]~postbuild: [email protected]
npm info ok
npm info lifecycle [email protected]~prepare: [email protected]
[email protected] C:\dev\code\jupyterlab_plotly\nbextension
+-- [email protected]
| +-- [email protected]
| | +-- [email protected]
<SNIP>

@dhirschfeld
Copy link
Contributor Author

Applying only 3194164 and not the Manually require babel presets commit and the build failed with the original index.js Unexpected token (28:6) error

@gnestor
Copy link
Owner

gnestor commented Feb 15, 2017

I think we're actually making process! I just pushed a new commit that uses require.resolve vs. just require which should resolve the new error that you're seeing. Give it a try!

@dhirschfeld
Copy link
Contributor Author

Well, that worked to a point - it got rid of the __esModule error, but it hasn't fixed the parse error:

Module parse failed: C:\dev\code\jupyterlab_plotly\nbextension\node_modules\jupyterlab_plotly_react\index.js Unexpected token (28:6)

...so, despite the changes on the windows-fix branch, we appear to be back at square one :(

Sorry, I feel like I'm taking all your time and am not being much help. I can however test any proposed fixes and am happy to continue to do so, but I certainly don't expect you to invest a huge effort in fixing a Windows bug which doesn't affect you...

@dhirschfeld
Copy link
Contributor Author

For ref, I I did nuke node_modules before rebuilding:

git clean -xdf
git fetch upstream
git reset --hard upstream/windows-fix
npm i

I am on Node 7.5.0 at the moment and haven't (yet) tried this branch with any earlier node versions

@gnestor
Copy link
Owner

gnestor commented Feb 16, 2017

It's ok, if this is affecting all Windows users then it's really important! The only other thing that I can think of (at the moment) is that this line may not be working on your system:

exclude: /node_modules(?!\/jupyterlab_plotly_react)/,

https://github.com/gnestor/jupyterlab_plotly/blob/windows-fix/nbextension/webpack.config.js#L9

That is saying: don't transpile files in node_modules using babel EXCEPT for node_modules/jupyterlab_plotly_react. If this line is somehow not matching the jupyterlab_plotly_react module that we installed from the component directory, then it won't be transpiled by babel and that would explain why it's choking on JSX.

@dhirschfeld
Copy link
Contributor Author

dhirschfeld commented Feb 16, 2017

Success! 🎉

I wasn't sure what that line was supposed to be doing, but with your description I found this issue which seemed a likely culprit.

I reverted to master, applied the below patch and the compilation was successful!

C:\dev\code\jupyterlab_plotly\nbextension [master ≡ +0 ~1 -0 !]
λ git diff
diff --git a/nbextension/webpack.config.js b/nbextension/webpack.config.js
index 8a4ba85..115f674 100644
--- a/nbextension/webpack.config.js
+++ b/nbextension/webpack.config.js
@@ -6,7 +6,7 @@ var path = require('path');
 var loaders = [
   {
     test: /\.js$/,
-    exclude: /node_modules(?!\/jupyterlab_plotly_react)/,
+    exclude: /node_modules(?![\\\/]jupyterlab_plotly_react)/,
     loader: 'babel-loader',
     query: { presets: [ 'latest', 'stage-0', 'react' ] }
   },

According to the issue that should also work on linux. I'd put it a PR but given it's 4-char fix it's probably easier to just test manually!

Thanks again for your help sorting it out!

@gnestor
Copy link
Owner

gnestor commented Feb 16, 2017

Great news!!!

I just cleaned up that branch and to simply use path.resolve to normalize paths and include with an array of paths vs. exclude which is probably less fragile. Can you try it once more to confirm? I will then update the other mimerender extensions and the cookiecutter. Thanks for bringing this to our attention and working with me to figure it out!

@dhirschfeld
Copy link
Contributor Author

I can report that the build also succeeded on the latest windows-fix commit.

@gnestor
Copy link
Owner

gnestor commented Feb 17, 2017

Great! Thanks for your help! I will merge this shortly...

@gnestor gnestor closed this as completed Apr 11, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants