Unexpected token: name (VerticalTimelineElement)

[adirpur]

Hi, I am trying to use "react-vertical-timeline-component" component and all works well but when I am trying to minify it using "uglifiy-js" I got this exception: 'Unexpected token: name (VerticalTimelineElement)'

looks like a transpile issue I use all import options but it still doesn't work including dist-modules and dist-es6

This is the code:

Can you help? Thanks,

[stephane-monnot]

Hi, Could you provide a full example please ? Thanks,

[adirpur]

it is one page from all our project application is this helps?

`import React from 'react'; import PropTypes from 'prop-types'; import {connect} from 'react-redux'; import {VerticalTimeline, VerticalTimelineElement} from 'react-vertical-timeline-component'; import Spinner from '@mh-core/components/Animations/Spinner/index';

import {getMapDispatchToProps, getMapStateToProps} from '../../../../JS/Services/Billing/Redux/reduxService';

import as actions from './actions'; import as selectors from './selectors';

import './index.scss'; import EventCardContent, { BENEFIT_TYPE, SUPPORT_CALL_TYPE, TRANSACTION_TYPE, } from '../../Pages/AccountInfoTimeline/Components/EventCardContent/index.react'; import EventIcon from '../../Pages/AccountInfoTimeline/Components/EventIcon/index.react';

const propTypes = { actions: PropTypes.object, timelineInfo: PropTypes.arrayOf(PropTypes.object), }; const defaultProps = { actions: {}, timelineInfo: [], };

/**

• @name AccountInfoTimelineContainer
• @module SiteUtilities

• @example */ export class AccountInfoTimelineContainer extends React.Component { constructor(props) { super(props); }

  componentDidMount() { const accountIdIndex = window.location.search.indexOf('account_id=') + 'account_id='.length; const accountId = window.location.search.substring(accountIdIndex); this.props.actions.getAccountInfoTimeline(accountId); }

  render() { const {timelineInfo} = this.props; return (

  {timelineInfo && timelineInfo.length > 0 && !timelineInfo[0] ? (
  ) : ( _.map(timelineInfo, (infoItem, key) => { return ( )} > ); }) )}

  );

  } }

const mapStateToProps = getMapStateToProps(selectors); const mapDispatchToProps = getMapDispatchToProps(actions);

AccountInfoTimelineContainer.propTypes = propTypes; AccountInfoTimelineContainer.defaultProps = defaultProps;

export default connect( mapStateToProps, mapDispatchToProps )(AccountInfoTimelineContainer); `

[stephane-monnot]

Did you use create react app ? another boilerplate ? the error seems to occur during build stage, so it's better if you can share the webpack config. A complete project sources is better.

[adirpur]

The complete project size is very big This is the webpack config, hope it will help

`const ModuleUpdateLogger = require('../ModuleUpdateLogger');

module.exports = (entry, logFile, createStats) => ({ entry, devtool: false, output: { library: '[name]Server', libraryExport: 'default', libraryTarget: 'commonjs2', }, target: 'node', module: { rules: [ { test: /.scss$/, use: 'null-loader', }, { test: /.(js|jsx)$/, exclude: /node_modules/, use: { loader: require.resolve('babel-loader'), options: require('@mh-build/build/babel/server.babel.config'), }, }, ], }, plugins: [ new ModuleUpdateLogger('Server', { logFile, createStats, }), ], }); `

[stephane-monnot]

Did you fix the problem ?

[adirpur]

Hi, I was waiting for an answer/solution from you The project is currently stuck because of it Can you help?

On Sun, 26 Apr 2020 at 11:44 Stéphane Monnot notifications@github.com wrote:

Did you fix the problem ?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/stephane-monnot/react-vertical-timeline/issues/53#issuecomment-619510961, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFUZHEA3WTU4ZCL45ZXSJTLROPX5HANCNFSM4MJKM3WQ .

[stephane-monnot]

Sorry but I can't reproduce the problem. I found a similar issue : https://github.com/webpack/webpack/issues/2972

[adirpur]

Hi, Thanks According to the issue you sent me, looks like uglify.js doesn’t work with es6 Did you succeed to use uglify js with the timeline component? If yes, can you tell how?

On Wed, 29 Apr 2020 at 11:32 Stéphane Monnot notifications@github.com wrote:

Sorry but I can't reproduce the problem. I found a similar issue : webpack/webpack#2972 https://github.com/webpack/webpack/issues/2972

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/stephane-monnot/react-vertical-timeline/issues/53#issuecomment-621064590, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFUZHEA4MQPVUZM7TC3MRIDRO7Q2BANCNFSM4MJKM3WQ .

[stephane-monnot]

Sorry, I don't use uglify.

[adirpur]

Any plan to support uglify in this component? Or any workaround?

On Fri, 1 May 2020 at 13:44 Stéphane Monnot notifications@github.com wrote:

Sorry, I don't use uglify.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/stephane-monnot/react-vertical-timeline/issues/53#issuecomment-622339639, or unsubscribe https://github.com/notifications/unsubscribe-auth/AFUZHECJ4QR26HQ5S7VCGM3RPKRZBANCNFSM4MJKM3WQ .

[stephane-monnot]

You can submit a PR if you want to fix it.