Version 5.1.0 breaks riot.config.js

[markgarrigan]

I have two riot projects...

One project has these dependencies

"@riotjs/cli": "^5.0.0",
"@riotjs/compiler": "^5.1.3",
"chokidar-cli": "^2.1.0",
"concurrently": "^5.3.0",
"esbuild": "^0.8.26",
"riot": "^5.1.2",
"sass": "^1.32.5"

The other project has these dependencies

"@riotjs/cli": "^5.1.2",
"@riotjs/compiler": "^5.1.3",
"chokidar-cli": "^2.1.0",
"concurrently": "^5.3.0",
"esbuild": "^0.8.34",
"riot": "^5.1.4",
"sass": "^1.32.5"

Both projects have the exact same riot.config.js

import { registerPreprocessor } from '@riotjs/compiler'
import { dirname } from 'path'
import sass from 'sass'

registerPreprocessor('css', 'scss', function (code, { options }) {
  const { file } = options

  const { css } = sass.renderSync({
    data: code,
    includePaths: [dirname(file)]
  })

  return {
    code: css.toString(),
    map: null
  }
})

Both projects have the same npm build script

"build": "riot src/index.js -o public/app.js -c riot.config",

When I npm run build on the cli v5.0.0 project it works great. When I npm run build on the cli v5.1.2 project it errors out with this trace

% npm run build

> xxxxxxxx@3.0.0 build
> riot src/index.js -o public/app.js -c riot.config

It was not possible to load your config file, are you sure the path is correct?
A critical error occurred
Trace: /Users/xxxxxx/www/xxxxxx/riot.config.js:1
import { registerPreprocessor } from '@riotjs/compiler'
^^^^^^

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 loadConfig (/Users/xxxxx/www/xxxxxx/node_modules/@riotjs/cli/cli.js:291:10)
    at /Users/xxxxxx/www/xxxxxx/node_modules/cumpa/cumpa.js:24:48
    at /Users/xxxxxx/www/xxxxx/node_modules/cumpa/cumpa.js:24:46
    at panic (/Users/xxxxxx/www/xxxx/node_modules/@riotjs/cli/cli.js:32:5)
    at loadConfig (/Users/xxxxxx/www/xxxxx/node_modules/@riotjs/cli/cli.js:295:5)
    at /Users/xxxxx/www/xxxxx/node_modules/cumpa/cumpa.js:24:48
    at /Users/xxxxx/www/xxxxx/node_modules/cumpa/cumpa.js:24:46
    at run (/Users/xxxxx/www/xxxxx/node_modules/@riotjs/cli/cli.js:346:4)
    at Object.<anonymous> (/Users/xxxxx/www/xxxxx/node_modules/@riotjs/cli/cli.js:365:8)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    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)
npm ERR! code 1
npm ERR! path /Users/xxxxx/www/xxxxx
npm ERR! command failed
npm ERR! command sh -c riot src/index.js -o public/app.js -c riot.config

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/xxxxx/.npm/_logs/2021-01-24T11_25_19_271Z-debug.log

The first obvious change I see from v5.0.0 to v 5.1.0 is the addition of a rollup.config.js file. https://github.com/riot/cli/blob/13c182de1ef0897df5bc596bda8fe619feb88153/rollup.config.js

If I npm remove @riotjs/cli in the newer project then npm i @riotjs/cli@5.0.0 it works again.

[GianlucaGuarini]

As quick fix you can simply use common js instead:

const { registerPreprocessor } = require('@riotjs/compiler')
const { dirname } = require('path')
const sass = require('sass')

registerPreprocessor('css', 'scss', function (code, { options }) {
  const { file } = options

  const { css } = sass.renderSync({
    data: code,
    includePaths: [dirname(file)]
  })

  return {
    code: css.toString(),
    map: null
  }
})

I will work on a patch asap

[GianlucaGuarini]

Fixed, please use @riotjs/cli@5.1.4