Don't compile their code to ES5 before publishing to npm

[TungXuan]

When build production version with react-scripts build I got the bellow error:
Failed to minify the code from this file: ./node_modules/@opuscapita/react-filemanager/lib/index.js:32612

[kvolkovich-sc]

Its strange.

I didn't use react-scripts before. But I tries:

# Init new project using create-react-app
npm init react-app .
yarn add @opuscapita/react-filemanager
yarn add @opuscapita/react-filemanager-connector-node-v1

App.js

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { FileManager, FileNavigator } from '@opuscapita/react-filemanager';
import connectorNodeV1 from '@opuscapita/react-filemanager-connector-node-v1';

const apiOptions = {
  ...connectorNodeV1.apiOptions,
  apiRoot: `http://localhost:3020/api` // Or you local Server Node V1 installation.
};

const fileManager = (
 <div style={{ height: '480px' }}>
    <FileManager>
      <FileNavigator
        id="filemanager-1"
        api={connectorNodeV1.api}
        apiOptions={apiOptions}
        capabilities={connectorNodeV1.capabilities}
        initialResourceId={'Lw'}
        listViewLayout={connectorNodeV1.listViewLayout}
        viewLayoutOptions={connectorNodeV1.viewLayoutOptions}
      />
    </FileManager>
  </div>
);


class App extends Component {
  render() {
    return (
      <div className="App">
          {fileManager}
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Welcome to React</h1>
        </header>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}

export default App;

yarn start

Result:

Can you provide more information if your issue still relevant?

[TungXuan]

Yes, you can run it with yarn start
But my issue I got when build a production version. you can try yarn build

[kvolkovich-sc]

I found this line.

See line 32612:

I replaced it and it build were successful.

Looks like let keyword is an issue. I'll republish the library soon (today/tomorrow).

[TungXuan]

Yes, I follow your steps but it will get many errors from your libs. How I can change it to es5 code?

[TungXuan]

I replace
`function getMessage(locale, key, params) {
let translationExists = (translations[locale] && translations[locale][key]);
let translation = translationExists ? translations[locale][key] : translations['en'][key];
if (!params) {
return translation;
}

let re = /{\w+}/g;
function replace(match) {
let replacement = match.slice(1, -1);
return params[replacement] ? params[replacement] : '';
}

return translation.replace(re, replace);
}to function getMessage(locale, key, params) {
var translationExists = translations[locale] && translations[locale][key];
var translation = translationExists ? translations[locale][key] : translations['en'][key];
if (!params) {
return translation;
}

var re = /{\w+}/g;
function replace(match) {
var replacement = match.slice(1, -1);
return params[replacement] ? params[replacement] : '';
}

return translation.replace(re, replace);
}`
and it working good

[kvolkovich-sc]

Fixed in @opuscapita/react-filemanager@1.0.12.

@TungXuan, thanks again for a bug reporting!

🪲 🔫