# Pull Request

## 📖 Description

The rollup configuration docs for FAST Element v1 cause corrupted HTML, this change ports over validated configuration options used in Fluent UI web components.
 
### 🎫 Issues

Closes #6795

##  Checklist

### General

<!--- Review the list and put an x in the boxes that apply. -->

- [ ] I have included a change request file using `$ yarn change`
- [ ] I have added tests for my changes.
- [ ] I have tested my changes.
- [x] I have updated the project documentation to reflect my changes.
- [x] I have read the [CONTRIBUTING](https://github.com/microsoft/fast/blob/master/CONTRIBUTING.md) documentation and followed the [standards](https://github.com/microsoft/fast/blob/master/CODE_OF_CONDUCT.md#our-standards) for this project.
This commit is contained in:
Jane Chu 2024-06-11 08:21:45 -07:00 коммит произвёл GitHub
Родитель 0e3632ff90
Коммит 62af44f5df
Не найден ключ, соответствующий данной подписи
Идентификатор ключа GPG: B5690EEEBB952194
1 изменённых файлов: 40 добавлений и 17 удалений

Просмотреть файл

@ -99,6 +99,38 @@ import copy from 'rollup-plugin-copy';
import serve from 'rollup-plugin-serve';
import { terser } from 'rollup-plugin-terser';
/**
* Reduces extra spaces in HTML tagged templates.
*
* @param {string} data - the fragment value
* @returns string
*/
export function transformHTMLFragment(data) {
data = data.replace(/\s*([<>])\s*/g, '$1'); // remove spaces before and after angle brackets
return data.replace(/\s{2,}/g, ' '); // Collapse all sequences to 1 space
}
/**
* Reduces extra spaces in CSS tagged templates.
*
* Breakdown of this regex:
* (?:\s*\/\*(?:.|\s)+?\*\/\s*) Remove comments (non-capturing)
* (?:;)\s+(?=\}) Remove semicolons and spaces followed by property list end (non-capturing)
* \s+(?=\{) Remove spaces before property list start (non-capturing)
* (?<=:)\s+ Remove spaces after property declarations (non-capturing)
* \s*([{};,])\s* Remove extra spaces before and after braces, semicolons, and commas (captures)
*
* @param {string} data - the fragment value
* @returns string
*/
export function transformCSSFragment(data) {
return data.replace(/(?:\s*\/\*(?:.|\s)+?\*\/\s*)|(?:;)\s+(?=\})|\s+(?=\{)|(?<=:)\s+|\s*([{};,])\s*/g, '$1');
}
const parserOptions = {
sourceType: 'module',
};
export default {
input: 'src/main.ts',
output: {
@ -109,23 +141,14 @@ export default {
},
plugins: [
transformTaggedTemplate({
tagsToProcess: ['html','css'],
parserOptions: {
sourceType: "module",
plugins: [
"typescript",
[
"decorators",
{ decoratorsBeforeExport: true }
]
]
},
transformer(data) {
data = data.replace(/\s([{}()>~+=^$:!;])\s/gm, '$1');
data = data.replace(/([",[]])\s+/gm, '$1');
data = data.replace(/\s{2,}/gm, ' ');
return data.trim();
}
tagsToProcess: ['css'],
transformer: transformCSSFragment,
parserOptions,
}),
transformTaggedTemplate({
tagsToProcess: ['html'],
transformer: transformHTMLFragment,
parserOptions,
}),
typescript(),
resolve(),