feat: update to rollup 4 (#1370)

Co-authored-by: acondal <[email protected]>

packages/x-archetype-utils/package.json

@@ -37,17 +37,17 @@
   },
   "dependencies": {
     "@empathyco/x-deep-merge": "^2.0.3-alpha.0",
+    "@empathyco/x-utils": "workspace:^1.0.3-alpha.0",
     "tslib": "~2.6.0",
     "vue-i18n": "~8.28.2"
   },
   "devDependencies": {
-    "@empathyco/x-utils": "^1.0.3-alpha.0",
     "@types/jest": "~27.5.0",
     "@types/node": "~18.19.0",
     "@vue/test-utils": "~1.0.3",
     "jest": "~27.5.0",
     "rimraf": "~3.0.2",
-    "rollup": "~2.79.1",
+    "rollup": "~4.9.1",
     "rollup-plugin-copy": "~3.5.0",
     "rollup-plugin-delete": "~2.0.0",
     "rollup-plugin-typescript2": "~0.36.0",

packages/x-archetype-utils/rollup.config.js → packages/x-archetype-utils/rollup.config.mjs

@@ -4,17 +4,19 @@ import typescript from 'rollup-plugin-typescript2';
 
 export default {
   input: 'src/index.ts',
-  preserveModules: true,
   output: [
     {
       format: 'cjs',
-      dir: 'dist/cjs'
+      dir: 'dist/cjs',
+      preserveModules: true
     },
     {
       format: 'esm',
-      dir: 'dist/esm'
+      dir: 'dist/esm',
+      preserveModules: true
     }
   ],
+  external: ['@empathyco/x-deep-merge', '@empathyco/x-utils', 'vue-i18n'],
   plugins: [
     del({ targets: 'dist' }),
     copy({

packages/x-components/build/build.ts

@@ -31,5 +31,5 @@ async function build(): Promise<any> {
  * Function for deleting useless folders.
  */
 function removeTempFiles(): void {
-  fs.rmdirSync(path.join(rootDir, 'temp'), { recursive: true });
+  fs.rmSync(path.join(rootDir, 'temp'), { recursive: true });
 }

packages/x-components/build/rollup-plugins/design-system.rollup-plugin.ts

@@ -56,7 +56,7 @@ export function importTokens(): Plugin {
  * This function returns a {@link Plugin | RollupJS Plugin} to omit the `.js` files from the
  * output generation. This is necessary because the `rollup-plugin-styles` plugin outputs `.js`
  * files together with the `.css`, to import them as module. It has a mode to only "emit" CSS,
- * but it needs another plugin (lintcss) and is failing right now.
+ * but it needs another plugin (litcss) and is failing right now.
  *
  * @returns The plugin object to use in the Rollup config.
  * @internal

packages/x-components/build/rollup.config.ts

@@ -36,7 +36,7 @@ export const rollupConfig = createRollupOptions({
      * Because of that, when rollup detects a circular dependency (it emits a warning), we stop
      * the build with an error */
     if (warning.code === 'CIRCULAR_DEPENDENCY') {
-      throw Error(`Circular dependency found: ${warning.cycle?.join(' ') as string}`);
+      throw Error(`Circular dependency found: ${warning.ids?.join(' ') as string}`);
     }
   },
   external(id) {
@@ -119,7 +119,7 @@ export const rollupConfig = createRollupOptions({
     copy({
       targets: [
         {
-          src: ['build-helpers', 'CHANGELOG.md', 'package.json', 'README.md', 'docs'],
+          src: ['CHANGELOG.md', 'package.json', 'README.md', 'docs'],
           dest: buildPath
         }
       ],
@@ -136,9 +136,9 @@ export const rollupConfig = createRollupOptions({
 const commonCssOptions = createRollupOptions({
   output: {
     dir: cssOutputDirectory,
-    assetFileNames: '[name][extname]'
-  },
-  preserveModules: true
+    assetFileNames: '[name][extname]',
+    preserveModules: true
+  }
 });
 
 /**

packages/x-components/package.json

@@ -30,7 +30,7 @@
     "./tests/**/*",
     "**/*.scss",
     "**/*.scss.js",
-    "**/*vue_styles.*.vue.js",
+    "**/*vue[0-9].js",
     "**/*.css",
     "**/*.vue"
   ],
@@ -97,7 +97,7 @@
     "@empathyco/x-tailwindcss": "^1.1.2-alpha.1",
     "@microsoft/api-documenter": "~7.23.0",
     "@microsoft/api-extractor": "~7.39.0",
-    "@rollup/plugin-commonjs": "~25.0.0",
+    "@rollup/plugin-commonjs": "~25.0.7",
     "@testing-library/jest-dom": "~5.17.0",
     "@types/autoprefixer": "~10.2.0",
     "@types/glob": "^8.0.1",
@@ -118,11 +118,9 @@
     "postcss-dir-pseudo-class": "~7.0.0",
     "postcss-logical": "~4.0.2",
     "rimraf": "~3.0.2",
-    "rollup": "~2.79.1",
+    "rollup": "~4.9.1",
     "rollup-plugin-copy": "~3.5.0",
     "rollup-plugin-delete": "~2.0.0",
-    "rollup-plugin-rename": "~1.0.1",
-    "rollup-plugin-sourcemaps": "~0.6.3",
     "rollup-plugin-styles": "~4.0.0",
     "rollup-plugin-typescript2": "~0.36.0",
     "rollup-plugin-vue": "~5.1.9",

packages/x-tailwindcss/demo/rollup.config.js → packages/x-tailwindcss/demo/rollup.config.mjs

@@ -2,11 +2,12 @@ import { resolve } from 'path';
 import commonjs from '@rollup/plugin-commonjs';
 import typescript from 'rollup-plugin-typescript2';
 import vue from 'rollup-plugin-vue';
+import * as url from 'url';
+const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
 
 export default {
   input: resolve(__dirname, 'src/index.ts'),
-  output: [{ format: 'esm', dir: resolve(__dirname, '../showcase') }],
-  preserveModules: true,
+  output: [{ format: 'esm', dir: resolve(__dirname, '../showcase'), preserveModules: true }],
   external: [
     'vue',
     'vue-property-decorator',

packages/x-tailwindcss/package.json

@@ -30,7 +30,7 @@
     "dev": "vite serve demo",
     "dev:build": "vite build demo",
     "prebuild": "rimraf ./dist ./showcase ./*.tgz",
-    "build": "rollup -c && rollup -c demo/rollup.config.js",
+    "build": "rollup -c && rollup -c demo/rollup.config.mjs",
     "postbuild": "pnpm pack",
     "lint": "eslint . --ext .ts,.vue",
     "prepublishOnly": "pnpm run build"
@@ -57,12 +57,12 @@
     }
   },
   "devDependencies": {
-    "@rollup/plugin-commonjs": "~25.0.0",
+    "@rollup/plugin-commonjs": "~25.0.7",
     "autoprefixer": "~10.4.4",
     "postcss": "~8.4.12",
     "postcss-import": "~15.1.0",
     "rimraf": "~3.0.2",
-    "rollup": "~2.79.1",
+    "rollup": "~4.9.1",
     "rollup-plugin-typescript2": "~0.36.0",
     "rollup-plugin-vue": "~5.1.9",
     "tailwindcss": "~3.4.0",

packages/x-tailwindcss/rollup.config.js → packages/x-tailwindcss/rollup.config.mjs

@@ -1,14 +1,15 @@
 import { resolve } from 'path';
 import typescript from 'rollup-plugin-typescript2';
 import commonjs from '@rollup/plugin-commonjs';
+import * as url from 'url';
+const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
 
 export default {
   input: resolve(__dirname, 'src/index.ts'),
   output: [
-    { format: 'esm', dir: resolve(__dirname, 'dist/esm') },
-    { format: 'cjs', dir: resolve(__dirname, 'dist/cjs'), exports: 'auto' }
+    { format: 'esm', dir: resolve(__dirname, 'dist/esm'), preserveModules: true },
+    { format: 'cjs', dir: resolve(__dirname, 'dist/cjs'), preserveModules: true, exports: 'auto' }
   ],
-  preserveModules: true,
   external: ['tailwindcss', 'tailwindcss/plugin', '@empathyco/x-deep-merge', '@empathyco/x-utils'],
   plugins: [
     commonjs(),

packages/x-types/package.json

@@ -47,7 +47,7 @@
     "@microsoft/api-extractor": "~7.39.0",
     "@types/jest": "~27.5.0",
     "jest": "~27.5.0",
-    "rollup": "~2.79.1",
+    "rollup": "~4.9.1",
     "rollup-plugin-delete": "~2.0.0",
     "rollup-plugin-typescript2": "~0.36.0",
     "typescript": "~4.9.4"

packages/x-types/rollup.config.js → packages/x-types/rollup.config.mjs

@@ -4,15 +4,16 @@ import typescript from 'rollup-plugin-typescript2';
 /* Models - CJS & ESM build */
 const models = {
   input: 'src/index.ts',
-  preserveModules: true,
   output: [
     {
       format: 'cjs',
-      dir: 'dist/cjs'
+      dir: 'dist/cjs',
+      preserveModules: true
     },
     {
       format: 'esm',
-      dir: 'dist/esm'
+      dir: 'dist/esm',
+      preserveModules: true
     }
   ],
   plugins: [