Can not import third party libraries in the node-modules in .tsx file

[cindyliu-yb]

Stencil version: (run npm list @stencil/core from a terminal/cmd prompt and paste output below):

@stencil/[email protected] 
├── @stencil/[email protected]
└─┬ @stencil/[email protected]
  └── @stencil/[email protected]

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
I cannot import any third-party libraries in .tsx files.

Expected behavior:
I should be able to import third-party libraries and use them in a component class.

Steps to reproduce:

1. initiate a stencil-starter project and install moment library 'npm install --save momet'
2. run 'npm start'
3. Go to src/components/my-name/my-name.tsx to import moment
4. If using moment to convert a date format and assign the value to a public variable, in the terminal the compiler will start rebuilding but get stuck at "prerender index html started"
5. If using moment to convert a date format and assign the value to a public variable in componentWillLoad lifecycle, in the terminal the compiler will be able to rebuild but have the error that

           moment is not defined

Related code:
In my-name.tsx

import { Component, Prop, State } from '@stencil/core';
import { Element } from '@stencil/core';
import * as moment from 'moment';

@Component({
  tag: 'my-name',
  styleUrl: 'my-name.scss'
})
export class MyName {
    currentTime: any = moment(new Date()).format('YYYY-MM-DD');

    render() {
      return (
       <div>
         <div> Current time is { this.currentTime }</div>
       </div>
    );
  }
}

Thanks!

[mortenson]

I'm seeing this too, but I'm not sure what the ideal DX is for a solution. Maybe Stencil could see if a third party library is imported by a component and package it in dist/ if so?

Edit: I don't have this problem, but I'm not using moment or my third party library in the same way. Ignore comment above.

[jgw96]

Hello all! We are going to fix this with #162 . Thanks for opening an issue with us and welcome to the land of web components!