Get 2024 Templates Mega Bundle!19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets
Get for 99$

RTL Support


I am getting this error when I run this command: npm run rtl

Failed to load '/Users/mohammedhamouda/Desktop/Work/AiiA/dots_frontend/rtl.config.js' config

Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/mohammedhamouda/Desktop/Work/AiiA/dots_frontend/node_modules/del/index.js from /Users/mohammedhamouda/Desktop/Work/AiiA/dots_frontend/rtl.config.js not supported.
Instead change the require of index.js in /Users/mohammedhamouda/Desktop/Work/AiiA/dots_frontend/rtl.config.js to a dynamic import() which is available in all CommonJS modules.
at Object.<anonymous> (/Users/mohammedhamouda/Desktop/Work/AiiA/dots_frontend/rtl.config.js:2:13) {
code: 'ERR_REQUIRE_ESM'
}


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)


i also have the same error when tying to run gulp --rtl
i tried creating rtl.config.js with the gist i found on this forum in another thread but than i get the following error


[webpack-cli] Failed to load '/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/rtl.config.js' config
[webpack-cli] ReferenceError: require is not defined in ES module scope, you can use import instead
This file is being treated as an ES module because it has a '.js' file extension and '/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
at file:///Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/rtl.config.js:1:14
at ModuleJob.run (node:internal/modules/esm/module_job:222:25)
at async ModuleLoader.import (node:internal/modules/esm/loader:323:24)
at async WebpackCLI.tryRequireThenImport (/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/node_modules/webpack-cli/lib/webpack-cli.js:232:34)
at async loadConfigByPath (/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/node_modules/webpack-cli/lib/webpack-cli.js:1406:27)
at async Promise.all (index 0)
at async WebpackCLI.loadConfig (/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/node_modules/webpack-cli/lib/webpack-cli.js:1460:35)
at async WebpackCLI.createCompiler (/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/node_modules/webpack-cli/lib/webpack-cli.js:1781:22)
at async WebpackCLI.runWebpack (/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/node_modules/webpack-cli/lib/webpack-cli.js:1877:20)
at async Command.<anonymous> (/Users/shaimacbokprotw/Downloads/good_html_v1.1.3/tools/node_modules/webpack-cli/lib/webpack-cli.js:944:21)



Hi Mohammed Hamouda

Please use this updated rtl.config.js file. We will update it soon.


const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const RtlCssPlugin = require("rtlcss-webpack-plugin");

// Define paths
const rootPath = path.resolve(__dirname);
const distPath = path.join(rootPath, "src/assets");
const entryPath = path.join(distPath, "sass/style.scss");

module.exports = {
mode: "development",
stats: "verbose",
performance: {
hints: "error",
maxAssetSize: 10000000,
maxEntrypointSize: 4000000,
},
entry: {
"css/style": entryPath,
},
output: {
path: distPath,
filename: "[name].js",
},
resolve: {
extensions: [".scss"],
},
plugins: [
new MiniCssExtractPlugin({
filename: "[name].rtl.css",
}),
new RtlCssPlugin({
filename: "[name].rtl.css",
}),
],
module: {
rules: [
{
test: /\.scss$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
{
loader: "sass-loader",
options: {
sourceMap: true,
},
},
],
},
],
},
};


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(