domingues / rollup-plugin-css-chunks

Rollup plugin to extract CSS into chunks
MIT License
14 stars 8 forks source link

Invalid RegEx #21

Closed PatrickG closed 3 years ago

PatrickG commented 3 years ago

Hi, I just upgraded my sapper project from 0.28.0 to 0.29.1, but this plugin produces an error on regex routes.

The error is: Invalid regular expression: /CSS_FILE_[id([0-9]+)].aed3241e.js/: Unmatched ')'. I debugged the npm run dev command and could narrow it down to the RegEx in https://github.com/domingues/rollup-plugin-css-chunks/blob/master/index.ts#L168

The route is folder/[id([0-9]+)].svelte.

Some of the variables just before the RexEx: chunk.fileName = [id([0-9]+)].aed3241e.js chunk.name = [id([0-9]+)] css_file_name = [id([0-9]+)]-f2980803.css css_file_url = [id([0-9]+)]-f2980803.css

I think the chunk.fileName should be escaped.

PatrickG commented 3 years ago

I tested it with the escape sequence from sappers create_manifest_data.ts and it works.

I replaced

chunk.code = chunk.code.replace(new RegExp(`CSS_FILE_${chunk.fileName}`, 'g'), css_file_url);

with

const escapeChunkId = chunkId => chunkId
  .replace(/\?/g, '%3F')
  .replace(/#/g, '%23')
  .replace(/%5B/g, '[')
  .replace(/%5D/g, ']')
  .replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
chunk.code = chunk.code.replace(new RegExp(`CSS_FILE_${escapeChunkId(chunk.fileName)}`, 'g'), css_file_url);

I would make a PR, but I have no time now, sorry.