7

We're working to update our dApp to node 16 and update the dev config to point to the latest polkadot dev config.

We are using customize-cra to customize the babel loaders which looks partially as:

module.exports = override(
  ...addExternalBabelPlugins(
    '@babel/plugin-proposal-nullish-coalescing-operator',
    '@babel/plugin-proposal-numeric-separator',
    '@babel/plugin-proposal-optional-chaining',
    ['@babel/plugin-transform-runtime', { "useESModules": false }],
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-proposal-private-methods',
    '@babel/plugin-proposal-private-property-in-object',
    '@babel/plugin-syntax-bigint',
    '@babel/plugin-syntax-dynamic-import',
    '@babel/plugin-syntax-import-meta',
    '@babel/plugin-syntax-top-level-await',
    'babel-plugin-styled-components',
  ),
  ...addBabelPlugins(
    '@babel/plugin-proposal-nullish-coalescing-operator',
    '@babel/plugin-proposal-numeric-separator',
    '@babel/plugin-proposal-optional-chaining',
    ['@babel/plugin-transform-runtime', { "useESModules": false }],
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-proposal-private-methods',
    '@babel/plugin-proposal-private-property-in-object',
    '@babel/plugin-syntax-bigint',
    '@babel/plugin-syntax-dynamic-import',
    '@babel/plugin-syntax-import-meta',
    '@babel/plugin-syntax-top-level-await',
    'babel-plugin-styled-components',
  ),

We are getting issues as below:

Module parse failed: Unexpected token (6:14)
File was processed with these loaders:
 * ../../node_modules/react-scripts/node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| export const packageInfo = {
|   name: '@polkadot/api',
>   path: import.meta && import.meta.url ? new URL('.', import.meta.url).pathname : 'auto',
|   type: 'esm',
|   version: '7.12.1'

Any ideas how to resolve this?

1 Answer 1

6

I think the issue can be solved either by using a babel transform or maybe not using the import.meta.url as can be seen in your error:

import.meta && import.meta.url ? new URL('.', import.meta.url).pathname : 'auto'`

as the starting import.meta.url returns this error.

Maybe a simpler solution would be to:

const url = new URL('.', import.meta.url);
const result = url?.pathName || 'auto';

UPDATE: Above was not finally a correct response. Here is a link with the solution

4
  • This is not something we have directly written, it comes from the Polkadot dependencies.
    – Drew Stone
    Mar 16, 2022 at 11:13
  • 1
    Maybe this can help: polkadot.js.org/docs/usage/FAQ/…
    – Nikos
    Mar 16, 2022 at 14:32
  • 1
    Following the above link leads to a solution. Thanks Nikos!
    – Nepoche
    Mar 17, 2022 at 15:17
  • 1
    Might be worth editing the answer to include this info explicitly 😃
    – Nuke
    Mar 19, 2022 at 14:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.