admin管理员组

文章数量:1343906

I am trying to install the PhotoEditor SDK library () in my Ruby on Rails project by following the installation instructions provided in the official documentation (/). However, I am encountering an error in the DOM console that reads:

"Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: /Users/robeen/dev/cocoon-immo/node_modules/photoeditorsdk/esm/chunk-2FC7YEBB.js: unknown Statement of type "ForOfStatement""

I have already followed all the installation steps listed in the documentation, including installing the necessary peer dependencies (React, React DOM, and Styled Components) etc...

Despite following all the steps correctly, I am still encountering the error mentioned above. I would appreciate any help in resolving this issue. Thank you.

Dev environment :

 - Node : v14.15.5
 - Ruby : ruby 2.7.5p203 (2021-11-24 revision f69aeb8314) [arm64-darwin21]
 - Rails : Rails 6.1.7.3
 - NPM : 8.11.0

I am trying to install the PhotoEditor SDK library (https://www.npmjs./package/photoeditorsdk) in my Ruby on Rails project by following the installation instructions provided in the official documentation (https://img.ly/docs/pesdk/web/guides/rails/). However, I am encountering an error in the DOM console that reads:

"Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: /Users/robeen/dev/cocoon-immo/node_modules/photoeditorsdk/esm/chunk-2FC7YEBB.js: unknown Statement of type "ForOfStatement""

I have already followed all the installation steps listed in the documentation, including installing the necessary peer dependencies (React, React DOM, and Styled Components) etc...

Despite following all the steps correctly, I am still encountering the error mentioned above. I would appreciate any help in resolving this issue. Thank you.

Dev environment :

 - Node : v14.15.5
 - Ruby : ruby 2.7.5p203 (2021-11-24 revision f69aeb8314) [arm64-darwin21]
 - Rails : Rails 6.1.7.3
 - NPM : 8.11.0
  • javascript
  • ruby-on-rails
  • npm
Share Improve this question asked May 2, 2023 at 11:12 user12178999user12178999 9711 bronze badges 1
  • 1 This GitHub issue might be related. It is generally remended to run supported LTS versions of Node.js. v14 has reached its end of life (in 2021) and v18 is currently the LTS. – undefined Commented May 16, 2023 at 17:28
Add a ment  | 

3 Answers 3

Reset to default 15 +50

An internet search for Unknown Statement of type "ForOfStatement" turns up a lot of discussion about Babel and re-enabling IE11 support.

Try Updating your .browserlistrc file to include support for IE11.

It might look like this afterward:

defaults
IE 11

The rails application loads your javascript using a gem like https://github./rails/webpacker/

It is the configuration that is being used by webpacker and passed to babel that's causing the issue.

Like @tgf said, this should have been configurable by .browserslistrc, but the v6 upgrade migration guide of webpacker says:

Copy over custom browserlist config from .browserslistrc if it exists into the "browserslist" key in package.json and remove .browserslistrc.

So, try changing your package.json to include

  "browserslist": [
    "defaults",
    "IE11"
  ]

Our current suggestion would be to use the VanillaJS approach and either use the scripts from a CDN or the vendor folder instead of the NPM packages. e.g.:

<!DOCTYPE html>
<html>
  <head>
    <title>IntegrateWithRails</title>
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>

    <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
    <%= javascript_importmap_tags %>

    <script src="https://unpkg./[email protected]/umd/react.production.min.js"></script>
    <script src="https://unpkg./[email protected]/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg./[email protected]/umd/react-dom-server.browser.production.min.js"></script>
    <script src="https://unpkg./[email protected]/dist/styled-ponents.min.js"></script>
    <script src="https://cdn.img.ly/packages/imgly/photoeditorsdk/latest/umd/no-polyfills.js"></script>
  
  </head>

  <body>
      <%= yield %>
      <div id="editor" style="width: 100vw; height: 100vh;"></div>
      <script>
        PhotoEditorSDK.PhotoEditorSDKUI.init({
          container: '#editor',
          // Please replace this with your license: https://img.ly/dashboard
          license: '',
          image:
            'https://cdn.img.ly/packages/imgly/photoeditorsdk/latest/assets/example.jpg',
          assetBaseUrl:
            'https://cdn.img.ly/packages/imgly/photoeditorsdk/latest/assets',
        });
      </script>
  </body>
</html>

本文标签： javascriptUnknown Statement of type quotForOfStatementquot when trying to run an npm libraryStack Overflow

版权声明：本文标题：javascript - Unknown Statement of type &quot;ForOfStatement&quot; when trying to run an npm library - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1743725916a2528362.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。