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

@babel/preset-typescript parsing errors #6768

Closed
drcmda opened this Issue Nov 7, 2017 · 12 comments

Comments

Projects
None yet
7 participants
@drcmda

drcmda commented Nov 7, 2017

Choose one: is this a bug report or feature request?

Bug

I've basically added the typescript preset without making any changes, the code is not typed. It seems to hang up on a few things it has trouble parsing.

Input Code

const arg = undefined
!!arg && arg.foo()

Will cause parsing issues, like:

ERROR in ../awv3/three/object3.js
Module build failed: SyntaxError: object3.js: Unexpected token, expected ; (233:10)
  231 |         await this.emit(Object3.Events.Lifecycle.ChildAdded, { child: object })
  232 |         await object.emit(Object3.Events.Lifecycle.Added, { parent: this })
> 233 |         !!this.view && this.view.invalidate()
      |           ^
  234 |     }
  235 | }

ERROR in ../awv3/session/selector.js
Module build failed: SyntaxError: selector.js: Unexpected token, expected ; (91:17)
  89 |             this.on(['add', 'remove', 'removeAll'], () => {
  90 |                 const state = this.selectedIds
> 91 |                 !isEqual(state, oldState) && this.emit('changed', state, oldState)

And a separate issue. When i use babel-plugin-import which rewrites imports.

import React from 'react'
import { Icon } from 'antd'

class Test extends React.Component {
    render() {
        return <Icon type="cloud-download" />
    }
}

causes

ERROR in ./components/RunChecks.js
Module build failed: TypeError: Cannot read property 'referencePaths' of undefined
    at isImportTypeOnly (node_modules/@babel/plugin-transform-typescript/lib/index.js:232:35)

Babel/Babylon Configuration (.babelrc, package.json, cli command)

const babelOptions = {
    babelrc: false,
    cacheDirectory: true,
    presets: [
        ['@babel/preset-env', { modules: false, loose: true, targets: { chrome: 60 } }],
        '@babel/preset-stage-0',
        '@babel/preset-react',
        '@babel/preset-typescript',
    ],
    plugins: [
        ['babel-plugin-import', { libraryName: 'antd', style: 'css' }],
    ],
}

Your Environment

    "@babel/core": "7.0.0-beta.31",
    "@babel/preset-env": "7.0.0-beta.31",
    "@babel/preset-react": "7.0.0-beta.31",
    "@babel/preset-stage-0": "7.0.0-beta.31",
    "@babel/preset-typescript": "^7.0.0-beta.31",
    "babel-loader": "8.0.0-beta.0",
    "babel-plugin-import": "1.6.2",
    "antd": "3.0.0-beta.6",
software version(s)
node 8.9.9
npm 5.5.1
Operating System High Sierra
@babel-bot

This comment has been minimized.

Show comment
Hide comment
@babel-bot

babel-bot Nov 7, 2017

Collaborator

Hey @drcmda! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.

Collaborator

babel-bot commented Nov 7, 2017

Hey @drcmda! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.

@hzoo

This comment has been minimized.

Show comment
Hide comment
@hzoo

hzoo Nov 7, 2017

Member

Cool, can you provide the minimal snippet of code that actually fails (not just the code frame)? Then we can repo.

Member

hzoo commented Nov 7, 2017

Cool, can you provide the minimal snippet of code that actually fails (not just the code frame)? Then we can repo.

@drcmda

This comment has been minimized.

Show comment
Hide comment
@drcmda

drcmda Nov 7, 2017

sure, this is enough to bring it down:

const arg = undefined
!!arg && arg.foo()

One ! is causing the same trouble.

The Cannot read property 'referencePaths' of undefined error is an internal one (plugin-transform-typescript/lib/index.js:232:35), i wouldn't know how to trigger it.

drcmda commented Nov 7, 2017

sure, this is enough to bring it down:

const arg = undefined
!!arg && arg.foo()

One ! is causing the same trouble.

The Cannot read property 'referencePaths' of undefined error is an internal one (plugin-transform-typescript/lib/index.js:232:35), i wouldn't know how to trigger it.

@existentialism

This comment has been minimized.

Show comment
Hide comment
@existentialism

existentialism Nov 7, 2017

Member

Are you using transform-runtime? (See it in your environment list but not config)

Possibly related (transform-typescript + transform-runtime): #6093 (comment)

Member

existentialism commented Nov 7, 2017

Are you using transform-runtime? (See it in your environment list but not config)

Possibly related (transform-typescript + transform-runtime): #6093 (comment)

@hzoo

This comment has been minimized.

Show comment
Hide comment
@hzoo

hzoo Nov 7, 2017

Member

@drcmda I don't see 4 pkgs in the config, so you can remove those?

"@babel/plugin-proposal-class-properties": "7.0.0-beta.31",
"@babel/plugin-proposal-decorators": "7.0.0-beta.31",
"@babel/plugin-transform-classes": "7.0.0-beta.31",
"@babel/plugin-transform-runtime": "7.0.0-beta.31",
Member

hzoo commented Nov 7, 2017

@drcmda I don't see 4 pkgs in the config, so you can remove those?

"@babel/plugin-proposal-class-properties": "7.0.0-beta.31",
"@babel/plugin-proposal-decorators": "7.0.0-beta.31",
"@babel/plugin-transform-classes": "7.0.0-beta.31",
"@babel/plugin-transform-runtime": "7.0.0-beta.31",
@hzoo

This comment has been minimized.

Show comment
Hide comment
@hzoo

hzoo Nov 7, 2017

Member

Sounds like a parser issue with having no semicolons, it works fine without the typescript preset?

cc @andy-ms if you have time to take a look

Member

hzoo commented Nov 7, 2017

Sounds like a parser issue with having no semicolons, it works fine without the typescript preset?

cc @andy-ms if you have time to take a look

@drcmda

This comment has been minimized.

Show comment
Hide comment
@drcmda

drcmda Nov 8, 2017

@hzoo Yes, without the preset it runs fine. I added the commas, it worked as well.

drcmda commented Nov 8, 2017

@hzoo Yes, without the preset it runs fine. I added the commas, it worked as well.

@drcmda

This comment has been minimized.

Show comment
Hide comment
@drcmda

drcmda Nov 8, 2017

@existentialism No, i don't. Sorry, the package.json entry was a leftover, forgot to remove it.

The issue seems to be related to the babel-plugin-import plugin

    plugins: [
        ['babel-plugin-import', { libraryName: 'antd', style: 'css' }],
    ],
import React from 'react'
import { Icon } from 'antd'

class Test extends React.Component {
    render() {
        return <Icon type="cloud-download" />
    }
}

This plugin will rewrite the import statement to require calls which then triggers typescript:

Module build failed: TypeError: Cannot read property 'referencePaths' of undefined
    at isImportTypeOnly (node_modules/@babel/plugin-transform-typescript/lib/index.js:232:35)

drcmda commented Nov 8, 2017

@existentialism No, i don't. Sorry, the package.json entry was a leftover, forgot to remove it.

The issue seems to be related to the babel-plugin-import plugin

    plugins: [
        ['babel-plugin-import', { libraryName: 'antd', style: 'css' }],
    ],
import React from 'react'
import { Icon } from 'antd'

class Test extends React.Component {
    render() {
        return <Icon type="cloud-download" />
    }
}

This plugin will rewrite the import statement to require calls which then triggers typescript:

Module build failed: TypeError: Cannot read property 'referencePaths' of undefined
    at isImportTypeOnly (node_modules/@babel/plugin-transform-typescript/lib/index.js:232:35)
@hzoo

This comment has been minimized.

Show comment
Hide comment
@hzoo

hzoo Nov 8, 2017

Member

Ok 😂 then I'm never heard of that plugin and it's not one of our supported ones? Seems like it needs to be updated for v7 (most likely) or typescript plugin needs an update?

Member

hzoo commented Nov 8, 2017

Ok 😂 then I'm never heard of that plugin and it's not one of our supported ones? Seems like it needs to be updated for v7 (most likely) or typescript plugin needs an update?

@drcmda

This comment has been minimized.

Show comment
Hide comment
@drcmda

drcmda Nov 8, 2017

I think it's more or less the same issue as in #6093 (comment) - the moment any plugin touches imports typescript crashes. From looking at the sources, it already uses Babel 7.

This was a separate issue though. Comma parsing crashes regardless.

drcmda commented Nov 8, 2017

I think it's more or less the same issue as in #6093 (comment) - the moment any plugin touches imports typescript crashes. From looking at the sources, it already uses Babel 7.

This was a separate issue though. Comma parsing crashes regardless.

@Lodin

This comment has been minimized.

Show comment
Hide comment
@Lodin

Lodin Nov 26, 2017

I have the same problem as @drcmda.

I'm working on custom react-typescript boilerplate project, and recently I've started moving it to babel 7 stack instead of tsc. Problems started when I tried to execute npm run build script (npm start works well, not sure why, maybe because it uses latest Chrome version as a target, and runtime-transform just have no change to appear).

Error stack leads to isImportTypeOnly: it complains that binding argument is undefined for some reason.

I use @babel/plugin-transform-runtime, and if I remove it from plugins list, everything gets back to normal.

Lodin commented Nov 26, 2017

I have the same problem as @drcmda.

I'm working on custom react-typescript boilerplate project, and recently I've started moving it to babel 7 stack instead of tsc. Problems started when I tried to execute npm run build script (npm start works well, not sure why, maybe because it uses latest Chrome version as a target, and runtime-transform just have no change to appear).

Error stack leads to isImportTypeOnly: it complains that binding argument is undefined for some reason.

I use @babel/plugin-transform-runtime, and if I remove it from plugins list, everything gets back to normal.

@nicolo-ribaudo

This comment has been minimized.

Show comment
Hide comment
@nicolo-ribaudo

nicolo-ribaudo Nov 26, 2017

Member

@Lodin That bug has been fixed by #6879. It will be in the next release.

Member

nicolo-ribaudo commented Nov 26, 2017

@Lodin That bug has been fixed by #6879. It will be in the next release.

@lock lock bot added the outdated label May 3, 2018

@lock lock bot locked as resolved and limited conversation to collaborators May 3, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.