babel-plugin-import icon indicating copy to clipboard operation
babel-plugin-import copied to clipboard

babel-plugin-import does not import babel-plugin-proposal-class-properties

Open cengizcmataraci opened this issue 2 years ago • 3 comments

I have a problem with babel-plugin-import. I want to use react-pdf-to-image package in my React.js project, I want to transform pdf to jpg so I added this package in my project, after that I got this error, "Support for the experimental syntax 'classPrivateProperties' isn't currently enabled". I searched for the solution and the solution is adding inside babel config file this package. I use babel-plugin-import and after I add plugin-proposal-class-properties I still get error. There may be something I missed but I've been really trying to figure this out for hours.

.babelrc.js

const plugins = [
  [
    'babel-plugin-import',
    {
      libraryName: '@material-ui/core',
      // Use "'libraryDirectory': ''," if your bundler does not support ES modules
      libraryDirectory: 'esm',
      camel2DashComponentName: false,
    },
    'core',
  ],
  [
    'babel-plugin-import',
    {
      libraryName: '@material-ui/icons',
      // Use "'libraryDirectory': ''," if your bundler does not support ES modules
      libraryDirectory: 'esm',
      camel2DashComponentName: false,
    },
    'icons',
  ],
  [
    'babel-plugin-import',
    {
      libraryName: '@babel/plugin-proposal-class-properties',
      // Use "'libraryDirectory': ''," if your bundler does not support ES modules
      libraryDirectory: 'esm',
      camel2DashComponentName: false,
    },
    '@babel/plugin-proposal-class-properties',
  ],
];

module.exports = { plugins };

error

./node_modules/pdfjs-dist/build/pdf.js
SyntaxError: C:\Users\cengi\desktop\navlungo\webapp\node_modules\pdfjs-dist\build\pdf.js: Support for the experimental syntax 'classPrivateProperties' isn't currently enabled (3312:3):

  3310 |
  3311 | class WorkerTransport {
> 3312 |   #docStats = null;
       |   ^
  3313 |   #pageCache = new Map();
  3314 |   #pagePromises = new Map();
  3315 |   #metadataPromise = null;

Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.
If you want to leave it as-is, add @babel/plugin-syntax-class-properties (https://git.io/vb4yQ) to the 'plugins' section to enable parsing.  

cengizcmataraci avatar Dec 21 '21 14:12 cengizcmataraci

@cengizcmataraci Did you ever manage to solve this issue?

Athelian avatar May 19 '22 04:05 Athelian

@cengizcmataraci Did you ever manage to solve this issue?

Sorry I couldn't figure it out.

cengizcmataraci avatar May 19 '22 15:05 cengizcmataraci

Is this problem solved? I also encountered similar problems 😣

lianer3588 avatar Jun 07 '22 10:06 lianer3588