I do get the following error when running gulp --demo1 :
/wallet-frontend/tools/gulpfile.js:1 import { cleanTask } from "./gulp/clean.js"; ^^^^^^ SyntaxError:
Cannot use import statement outside a module
at wrapSafe (internal/modules/cjs/loader.js:979:16) at Module._compile (internal/modules/cjs/loader.js:1027:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10) at Module.load (internal/modules/cjs/loader.js:928:32) at Function.Module._load (internal/modules/cjs/loader.js:769:14) at Module.require (internal/modules/cjs/loader.js:952:19) at require (internal/modules/cjs/helpers.js:88:18) at execute (/usr/local/lib/node_modules/gulp/node_modules/gulp-cli/lib/versioned/^4.0.0/index.js:36:18) at Liftoff.handleArguments (/usr/local/lib/node_modules/gulp/node_modules/gulp-cli/index.js:201:24) at Liftoff.execute (/usr/local/lib/node_modules/gulp/node_modules/liftoff/index.js:201:12)
How to fix this? Thank you
Hi,
Note on the package.json
file. This step is very important for Webpack in the Metronic template. The default package.json
works for Gulp. To make it work for Webpack, you have to modify tools/package.json
and remove "type": "module"
. Otherwise, it will cause a compilation error when running the next command.
Thanks
To solve the error, set the type attribute to module when loading the script in your HTML code. When working with ECMAScript modules and JavaScript module import statements in the browser, you'll need to explicitly tell the browser that a script is module. To do this, you have to add type="module" onto any ‹script› tags that point to a JavaScript module. Once you do this you can import that module without issues.
< script type="module" src="./index.js"></script>
The error message you're encountering typically occurs when using ES6 module syntax (including the `import` statement) in a file that is not recognized as a module by Node.js. To fix this issue, you have a few options:
1. Use a module bundler: If you're working with Candy Crush a project that uses ES6 modules and you want to run it in a Node.js environment, you can use a module bundler like Webpack or Rollup. These tools can bundle your code and handle the module syntax, allowing it to run in Node.js. With a bundler, you would configure your build process to transform the ES6 modules into a format that Node.js understands (usually CommonJS modules).
2. Use Node.js module syntax: If you don't want to use a bundler and your project doesn't have complex dependencies, you can refactor your code to use the Node.js module syntax instead of ES6 modules. In Node.js, you can use the `require` function to import modules instead of the `import` statement. For example:
```javascript
const { cleanTask } = require("./gulp/clean.js");
```
3. Enable ES6 module support in Node.js (experimental): Starting from Node.js version 12, you can enable experimental support for ES6 modules by using the `--experimental-modules` flag when running Node.js. However, note that this feature is still experimental and may not be fully supported in all scenarios. To use it, you would rename your file to have a `.mjs` extension and run Node.js with the `--experimental-modules` flag. For example:
```shell
node --experimental-modules yourfile.mjs
```
Keep in mind that the specific solution depends on your project setup and requirements. If you're working on a larger project, using a module bundler like Webpack or Rollup is generally the recommended approach. However, for smaller projects or quick scripts, using Node.js module syntax or enabling experimental ES6 module support can be viable options.