# "Cannot use import statement outside a module"

**URL:** <https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959>\
**Category:** Ask us anything\
**Created:** [December 15, 2023, 12:31am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959 "2023-12-15T00:31:39Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![Guillenius](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/guillenius/32/9570_2.png) [@Guillenius](https://community.weweb.io/u/Guillenius)\
**Post date:** [December 15, 2023, 12:31am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/1 "2023-12-15T00:31:39Z")

</div>

hello there, I need help with this issue.

I try to encode somes strings to 3DES with this code:

```auto
**// Importing the crypto library**
 **import { CryptoJS } from "crypto-js";**

**// Getting the merchant order from the variables**
**const merchantOrder = variables['62eba781-ed3a-4e8b-a551-945a05c31167'];**

**// Defining the key for the 3DES encryption**
**const key = Buffer.from('0123456789abcdef0123456789abcdef0123456789abcdef', 'hex');**

**// Creating a cipher using 3DES**
**const cipher = crypto.createCipheriv('des-ede3', key, '');**

**// Encrypting the merchant order**
**let encrypted = cipher.update(merchantOrder, 'utf8', 'hex');**
**encrypted += cipher.final('hex');**

**// Returning the encrypted merchant order**
 **return encrypted;**

```

and appears this error:

> name: “SyntaxError”  
> stack: “SyntaxError: Cannot use import statement outside a module at executeCode ([https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1:343503](https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1:343503)) at bt ([https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1257:26404](https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1257:26404)) at Proxy.runTest ([https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1375:243137](https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1375:243137)) at [https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1375:226515](https://editor-cdn.weweb.io/public/js/index.1cd4c26a.js:1375:226515) at [https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:107458](https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:107458) at a ([https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:33337](https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:33337)) at l ([https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:33420](https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:33420)) at HTMLButtonElement.n ([https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:94414](https://editor-cdn.weweb.io/public/js/chunk-vendors.dde32e3d.js:1:94414)) at HTMLButtonElement.sentryWrapped ([https://browser.sentry-cdn.com/7.45.0/bundle.min.js:2:38971](https://browser.sentry-cdn.com/7.45.0/bundle.min.js:2:38971))”  
> message: “Cannot use import statement outside a module”

What can I do if I can not using “import”

Context:

A specific key is generated per operation. To obtain the derived key to be used in an operation, a 3DES encryption must be performed between the merchant key, which must be previously decoded in BASE 64, and the value of the order number of the operation (Ds\_Merchant\_Order).

The SHA256 HMAC is calculated from the value of the Ds\_MerchantParameters parameter and the key obtained in the previous step.

The result obtained is encoded in BASE 64, and the result of the encoding will be the value of the Ds\_Signature parameter.

pls help.

Regards.

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [December 15, 2023, 8:13am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/2 "2023-12-15T08:13:58Z")

</div>

Assuming this is in a js action (wich is wrapped in an async function) you can use dynamic imports.

---

<div class="post-metadata">

**Author:** ![Guillenius](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/guillenius/32/9570_2.png) [@Guillenius](https://community.weweb.io/u/Guillenius)\
**Post date:** [December 15, 2023, 12:52pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/3 "2023-12-15T12:52:28Z")

</div>

How can I do that? Can you help, my codgin it is not very good…  
Dynamic imports can works in the WF weweb´s? because when I try to put the line: import { CryptoJS } from “crypto-js”; the errror appears… thanks

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [December 15, 2023, 1:31pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/4 "2023-12-15T13:31:38Z")

</div>

> **[import() - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import)**
>
> The import() syntax, commonly called dynamic import, is a function-like expression that allows loading an ECMAScript module asynchronously and dynamically into a potentially non-module environment.

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [December 15, 2023, 1:36pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/5 "2023-12-15T13:36:04Z")

</div>

Also double check that this operation is meant to be performed in the browser on in a secure server

---

<div class="post-metadata">

**Author:** ![Guillenius](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/guillenius/32/9570_2.png) [@Guillenius](https://community.weweb.io/u/Guillenius)\
**Post date:** [December 16, 2023, 6:08pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/6 "2023-12-16T18:08:45Z")

</div>

I using this code:

```auto
// Import the CryptoJS library
import * as CryptoJS from "crypto-js";

// Get the DS_MERCHANT_ORDER value
const DS_MERCHANT_ORDER = variables['62eba781-ed3a-4e8b-a551-945a05c31167'];

// Define a secret key for encryption
const secretKey = "mySecretKey";

// Encrypt the DS_MERCHANT_ORDER value using 3DES
const encrypted = CryptoJS.TripleDES.encrypt(DS_MERCHANT_ORDER, secretKey);

// Convert the encrypted value to a string
const encryptedString = encrypted.toString();

// Return the encrypted string
return encryptedString;

```

but the error is the same…

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [December 17, 2023, 1:07am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/7 "2023-12-17T01:07:06Z")

</div>

because you are not using dynamic imports. It’s explained in the link of my previous post.  
There is also the native crypto library from tge browser, you may want ro check how to use it for the logic you need [Crypto - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Crypto). And again double check if you should do this from a secure server instead

---

<div class="post-metadata">

**Author:** ![Guillenius](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/guillenius/32/9570_2.png) [@Guillenius](https://community.weweb.io/u/Guillenius)\
**Post date:** [December 20, 2023, 1:32am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/8 "2023-12-20T01:32:59Z")

</div>

hello @dorilama I did this:

I declared a library when the app it is reload by workflow:

```auto
if(!window["scp-loading-df872b3d-1155-47c7-b771-6b866a5b9451"]) {
    window["scp-loading-df872b3d-1155-47c7-b771-6b866a5b9451"] = true;
    let doc;
    /* Adding script from https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js */
    doc = document.createElement('script');
    doc.src = 'https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js';
    document.body.appendChild(doc);
  }

```

then in a workflow I executed this:

```auto
function encrypt(key, message) {
  // Crear el objeto de cifrado
  cipher = CryptoJS.algo.TripleDES(key);

  // Cifrar los datos
  encryptedData = cipher.update(message);

  // Devolver el mensaje cifrado como una cadena de texto hexadecimal
  return encryptedData.toString();
}

// Definir la clave y el mensaje
const key = "62eba781-ed3a-4e8b-a551-945a05c31167";
const message = "Este es un mensaje de ejemplo";

// Cifrar el mensaje
const encryptedData = encrypt(key, message);

// Imprimir el mensaje cifrado
console.log(encryptedData);

```

but the error appears:

```auto
name: "TypeError"
stack: "TypeError: CryptoJS.algo.TripleDES is not a function at encrypt (eval at executeCode (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:365845), :3:26) at eval (eval at executeCode (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:365845), :17:23) at eval (eval at executeCode (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:365845), :21:3) at executeCode (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:365845) at ye (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:434801) at fe (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:433069) at fe (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:433445) at async fe (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:433439) at async fe (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:433439) at async fe (https://editor-cdn.weweb.io/ww_front/public/js/index.784e06f2.js:1:433439)"
message: "CryptoJS.algo.TripleDES is not a function"

```

what have I done wrong?

---

<div class="post-metadata">

**Author:** ![Guillenius](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/guillenius/32/9570_2.png) [@Guillenius](https://community.weweb.io/u/Guillenius)\
**Post date:** [December 22, 2023, 12:15pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/9 "2023-12-22T12:15:11Z")

</div>

hello, continue whit this issue, maybe if I do installe the npm plugin and found the encrypt package, works?

regards.

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [December 22, 2023, 12:39pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/10 "2023-12-22T12:39:45Z")

</div>

You can definitely try with the npm plugin.

---

<div class="post-metadata">

**Author:** ![raydeck](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/raydeck/32/384_2.png) [@raydeck](https://community.weweb.io/u/raydeck)\
**Post date:** [December 22, 2023, 7:04pm UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/11 "2023-12-22T19:04:25Z")

</div>

Hi! I’m on the move, but you are almost there.

First, based on your import code from the State Change Weweb Converter, CryptoJS is available to you from global scope. It’s a commonJS import, which means no need for import statement. Remove that and your first example should work. Note that references to CryptoJS will work only after the import code has run (presumably at page load)

Second, according to the documentation, CryptoJS.algo.TripleDES() is not a thing. Instead, CryptoJS.TripleDES.encrypt(message, passphrase) will do what you want. (Docs here: [CryptoJS - CryptoJS](https://cryptojs.gitbook.io/docs/))

Let me know if this helps?

---

<div class="post-metadata">

**Author:** ![Guillenius](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/guillenius/32/9570_2.png) [@Guillenius](https://community.weweb.io/u/Guillenius)\
**Post date:** [December 23, 2023, 1:28am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/12 "2023-12-23T01:28:27Z")

</div>

Hello @raydeck u right, I fixed the code like u said and the error disappeared!! But, when I executing the WF with this JS code:

```auto
const message = "fjer8fu8rejf8rjfr";
const passphrase = "Secret Passphrase";
const encryptedData = CryptoJS.TripleDES.encrypt(message, passphrase);
console.log(encryptedData);

```

the result is empty or undefined. Do you know what happens? regards!!!

BTW, on the page reload I have a WF with this code, like you said:

```auto
  if(!window["scp-loading-df872b3d-1155-47c7-b771-6b866a5b9451"]) {
    window["scp-loading-df872b3d-1155-47c7-b771-6b866a5b9451"] = true;
    let doc;
    /* Adding script from https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js */
    doc = document.createElement('script');
    doc.src = 'https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js';
    document.body.appendChild(doc);
  }

```

---

<div class="post-metadata">

**Author:** ![raydeck](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/raydeck/32/384_2.png) [@raydeck](https://community.weweb.io/u/raydeck)\
**Post date:** [December 23, 2023, 3:53am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/13 "2023-12-23T03:53:58Z")

</div>

I’m guessing a little but i suspect you need to replace “console.log(encrypteddata)” with “return encrypteddata.toString()” or something close to it- the crypto is docs will help further.

If this is bugging you after the holiday, consider joining us at [State Change](Https://statechange.ai)! Encryption and low code injection are both very much in the hardest 5% we work on together there.

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [December 23, 2023, 6:44am UTC](https://community.weweb.io/t/cannot-use-import-statement-outside-a-module/5959/14 "2023-12-23T06:44:50Z")

</div>

If you do this operation client-side with js actions in weweb your encryption key will be accessible by anybody. I doubt that the key is public to share, in fact the helper libraries provided by Redsys are all for server-side languages.