looker-open-source/components

Version 1.0.0 and 0.3.0 of @looker/visualization causing TS errors in project

rblakeman opened this issue · 1 comments

Problem

Trying to add @looker/visualizations to a basic CRA project (with TS support) and running into issues just starting the project:

Uncaught Error: Module parse failed: Unexpected token (27:12)
File was processed with these loaders:
 * ./node_modules/source-map-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
|  */
| 
> import type { CBar, CLine, CPie, CScatter, CTable } from '../adapters'
| 
| export const mockBarConfig: CBar = {
    at ./node_modules/@looker/visualizations/node_modules/@looker/visualizations-adapters/src/__mocks__/mockConfig.ts

Also noticed dozens of errors during typechecking. Specifically surfacing from within node_modules/@looker/visualizations/....

$ tsc --noEmit

ERROR in ./node_modules/@looker/visualizations/node_modules/@looker/visualizations-adapters/src/Debug/Debug.tsx 27:12

Module parse failed: Unexpected token (27:12)
File was processed with these loaders:
 * ./node_modules/source-map-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
|  */
| 
> import type { FC } from 'react'
| import React from 'react'
| import { Accordion2 } from '@looker/components'

....

Found 61 errors in 32 files.

Investigaton

At first glance it seemed like an issue with my tsconfig.json, or an issue with webpack/babel loaders. But after diving down that rabbit-hole and not finding a good solution I decided to take a look in the actual source for @looker/visualizations in node_modules and discovered it's currently published with just the raw .tsx files, rather than compiled down to .js with declaration files:
image

From there I tried looking at the version history in npmjs and went back to the two previous versions 0.3.0 and 0.2.15:
image

Workaround

Downgrading to 0.3.0 still has the same issue, but going back to 0.2.15 I get it all working again. Specifically seems to be because the package being downloaded has been published correctly by supplying .js files rather than the raw .ts files:
image (1)

Findings

From here I took a look at your releases/tags page and noticed that both versions 0.3.0 and 1.0.0 for @looker/visualizations are not listed anywhere. And looking at the npmjs page again we see the dates for those two broken versions are "a month ago" and "19 days ago". But looking at your git history for the visualization package, there hasn't been a change in about 5 months (which matches the npmjs date for 0.2.15).

Are versions 0.3.0 and 1.0.0 accidental releases? Perhaps something upstream in your repo publishing config changed causing the publishing issue of raw .ts files; combined with lerna marking that package as changed twice leading to these two "phantom" releases?

These issues should be resolved in the latest version of @looker/visualizations, which now contains compiled .js and .d.ts files instead of the .tsx source files.