prepare for beta 3

local/rollup/src/bundle/script.default.js

@@ -11,24 +11,27 @@ const {
 } = require('./plugins');
 
 const moduleFormats = ['es', 'esm', 'module'];
-const createMinifiedOutput = (baseOutput) => ({
+const createMinifiedOutput = (baseOutput) => {
-  ...baseOutput,
+  const extname = path.extname(baseOutput.file);
-  compact: true,
+  return {
-  file: baseOutput.file.replace('.js', '.min.js'),
+    ...baseOutput,
-  sourcemap: false,
+    compact: true,
-  plugins: [
+    file: baseOutput.file.replace(extname, `.min${extname}`),
-    ...(baseOutput.plugins || []),
+    sourcemap: false,
-    rollupTerser({
+    plugins: [
-      ecma: baseOutput.generatedCode === 'es2015' ? 2015 : 5,
+      ...(baseOutput.plugins || []),
-      safari10: true,
+      rollupTerser({
-      compress: {
+        ecma: baseOutput.generatedCode === 'es2015' ? 2015 : 5,
-        evaluate: false,
+        safari10: true,
-        module: moduleFormats.includes(baseOutput.format),
+        compress: {
-        passes: 3,
+          evaluate: false,
-      },
+          module: moduleFormats.includes(baseOutput.format),
-    }),
+          passes: 3,
-  ],
+        },
-});
+      }),
+    ],
+  };
+};
 
 module.exports = (resolve, options) => {
   const { rollup, paths, versions, alias, extractStyles, banner } = options;
@@ -38,9 +41,9 @@ module.exports = (resolve, options) => {
   const sourcemap = rawSourcemap;
 
   return versions
-    .map(({ format, generatedCode, file: filePathOverride, outputSuffix, minifiedVersion }) => {
+    .map(({ format, generatedCode, file: filePathOverride, extension, minifiedVersion }) => {
       const needsGlobals = format === 'umd' || format === 'iife';
-      const filePath = path.resolve(distPath, `${file}${outputSuffix || ''}.js`);
+      const filePath = path.resolve(distPath, `${file}${extension || '.js'}`);
 
       const baseOutput = {
         ...outputConfig,

local/rollup/src/defaultOptions.js

@@ -12,13 +12,13 @@ module.exports = {
     {
       format: 'cjs',
       generatedCode: 'es2015',
-      outputSuffix: '.cjs',
+      extension: '.cjs.js',
       minifiedVersion: true,
     },
     {
       format: 'esm',
       generatedCode: 'es2015',
-      outputSuffix: '.esm',
+      extension: '.esm.js',
       minifiedVersion: true,
     },
   ],

package-lock.json

@@ -28,6 +28,7 @@
         "@testing-library/jest-dom": "^5.16.5",
         "@testing-library/user-event": "^13.5.0",
         "@types/jest": "^28.1.6",
+        "@types/node": "^18.11.3",
         "@typescript-eslint/eslint-plugin": "^5.31.0",
         "@typescript-eslint/parser": "^5.31.0",
         "@vitest/coverage-c8": "^0.24.3",
@@ -5415,9 +5416,9 @@
       "integrity": "sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA=="
     },
     "node_modules/@types/node": {
-      "version": "16.11.68",
+      "version": "18.11.3",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.3.tgz",
-      "integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ=="
+      "integrity": "sha512-fNjDQzzOsZeKZu5NATgXUPsaFaTxeRgFXoosrHivTl8RGeV733OLawXsGfEk9a8/tySyZUyiZ6E8LcjPFZ2y1A=="
     },
     "node_modules/@types/parse-json": {
       "version": "4.0.0",
@@ -19519,6 +19520,10 @@
         "find-parent-dir": "^0.3.0"
       }
     },
+    "node_modules/node-starter": {
+      "resolved": "packages/test",
+      "link": true
+    },
     "node_modules/nopt": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz",
@@ -29782,7 +29787,7 @@
       }
     },
     "packages/overlayscrollbars": {
-      "version": "2.0.0-beta.2",
+      "version": "2.0.0-beta.3",
       "license": "MIT"
     },
     "packages/overlayscrollbars-ngx": {
@@ -31268,6 +31273,12 @@
         "react": ">=16.4.0"
       }
     },
+    "packages/overlayscrollbars-react/node_modules/@types/node": {
+      "version": "16.11.68",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
+      "integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ==",
+      "dev": true
+    },
     "packages/overlayscrollbars-svelte": {
       "version": "0.4.0",
       "devDependencies": {
@@ -31475,6 +31486,12 @@
         "vue": "^3.2.25"
       }
     },
+    "packages/overlayscrollbars-vue/node_modules/@types/node": {
+      "version": "16.11.68",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
+      "integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ==",
+      "dev": true
+    },
     "packages/overlayscrollbars-vue/node_modules/typescript": {
       "version": "4.7.4",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",
@@ -31488,6 +31505,10 @@
         "node": ">=4.2.0"
       }
     },
+    "packages/test": {
+      "name": "node-starter",
+      "version": "0.0.0"
+    },
     "website": {
       "dependencies": {
         "@mdx-js/loader": "^2.1.5",
@@ -35387,9 +35408,9 @@
       "integrity": "sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA=="
     },
     "@types/node": {
-      "version": "16.11.68",
+      "version": "18.11.3",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.3.tgz",
-      "integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ=="
+      "integrity": "sha512-fNjDQzzOsZeKZu5NATgXUPsaFaTxeRgFXoosrHivTl8RGeV733OLawXsGfEk9a8/tySyZUyiZ6E8LcjPFZ2y1A=="
     },
     "@types/parse-json": {
       "version": "4.0.0",
@@ -45896,6 +45917,9 @@
         "find-parent-dir": "^0.3.0"
       }
     },
+    "node-starter": {
+      "version": "file:packages/test"
+    },
     "nopt": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz",
@@ -47742,6 +47766,14 @@
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "typescript": "^4.8.4"
+      },
+      "dependencies": {
+        "@types/node": {
+          "version": "16.11.68",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
+          "integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ==",
+          "dev": true
+        }
       }
     },
     "overlayscrollbars-svelte": {
@@ -47878,6 +47910,12 @@
         "vue-tsc": "^1.0.8"
       },
       "dependencies": {
+        "@types/node": {
+          "version": "16.11.68",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.68.tgz",
+          "integrity": "sha512-JkRpuVz3xCNCWaeQ5EHLR/6woMbHZz/jZ7Kmc63AkU+1HxnoUugzSWMck7dsR4DvNYX8jp9wTi9K7WvnxOIQZQ==",
+          "dev": true
+        },
         "typescript": {
           "version": "4.7.4",
           "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",

package.json

@@ -24,6 +24,7 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/user-event": "^13.5.0",
     "@types/jest": "^28.1.6",
+    "@types/node": "^18.11.3",
     "@typescript-eslint/eslint-plugin": "^5.31.0",
     "@typescript-eslint/parser": "^5.31.0",
     "@vitest/coverage-c8": "^0.24.3",

packages/overlayscrollbars/package.json

@@ -1,6 +1,6 @@
 {
   "name": "overlayscrollbars",
-  "version": "2.0.0-beta.2",
+  "version": "2.0.0-beta.3",
   "description": "A scrollbar plugin that hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling.",
   "author": "Rene Haas | KingSora",
   "license": "MIT",
@@ -33,8 +33,8 @@
   "types": "types/overlayscrollbars.d.ts",
   "exports": {
     ".": {
-      "require": "./dist/overlayscrollbars.cjs.js",
+      "require": "./dist/overlayscrollbars.cjs",
-      "import": "./dist/overlayscrollbars.esm.js",
+      "import": "./dist/overlayscrollbars.mjs",
       "types": "./types/overlayscrollbars.d.ts"
     },
     "./overlayscrollbars.css": "./styles/overlayscrollbars.css"

packages/overlayscrollbars/rollup.config.js

@@ -13,19 +13,31 @@ module.exports = createRollupConfig({
     {
       format: 'cjs',
       generatedCode: 'es2015',
-      outputSuffix: '.cjs',
+      extension: '.cjs.js',
-      minifiedVersion: true,
+      minifiedVersion: false,
     },
     {
       format: 'esm',
       generatedCode: 'es2015',
-      outputSuffix: '.esm',
+      extension: '.esm.js',
-      minifiedVersion: true,
+      minifiedVersion: false,
+    },
+    {
+      format: 'cjs',
+      generatedCode: 'es2015',
+      extension: '.cjs',
+      minifiedVersion: false,
+    },
+    {
+      format: 'esm',
+      generatedCode: 'es2015',
+      extension: '.mjs',
+      minifiedVersion: false,
     },
     {
       format: 'iife',
       generatedCode: 'es2015',
-      outputSuffix: '.browser.es6',
+      extension: '.browser.es6.js',
       minifiedVersion: true,
       file: (originalPath) =>
         `${resolve(dirname(originalPath), 'browser', basename(originalPath))}`,
@@ -33,7 +45,7 @@ module.exports = createRollupConfig({
     {
       format: 'iife',
       generatedCode: 'es5',
-      outputSuffix: '.browser.es5',
+      extension: '.browser.es5.js',
       minifiedVersion: true,
       file: (originalPath) =>
         `${resolve(dirname(originalPath), 'browser', basename(originalPath))}`,

packages/overlayscrollbars/test/jest-node/moduleType.test.ts

@@ -0,0 +1,67 @@
+import path from 'path';
+import fs from 'node:fs';
+import { rollup } from 'rollup';
+
+// @ts-ignore
+import pkg from '~/../package.json';
+// @ts-ignore
+import rollupConfig from '~/../rollup.config';
+
+const cleanBundle = true;
+const cleanFixture = true;
+const expectedBundleDiff = 2300;
+
+const fixturesDir = path.join(__dirname, '.moduleTypeFixtures');
+const libraryFixturePath = path.join(fixturesDir, 'lib.js');
+const modulePkgJson = {
+  version: '0.0.0',
+  type: 'module',
+};
+const commonPkgJson = {
+  version: '0.0.0',
+  type: 'commonjs',
+};
+
+describe('module type', () => {
+  // build the fixture
+  beforeAll(async () => {
+    const { module } = pkg;
+    const esmEntryFilename = path.basename(module);
+    const config = rollupConfig.find((inputConfig: any) => {
+      const { output } = inputConfig;
+      if (output) {
+        const outputArr = Array.isArray(output) ? output : [output];
+        const outputConfig = outputArr.find(({ file }) => path.basename(file) === esmEntryFilename);
+        if (outputConfig) {
+          inputConfig.output = outputConfig;
+          inputConfig.output.sourcemap = false;
+          inputConfig.output.file = libraryFixturePath;
+          inputConfig.plugins = inputConfig.plugins.filter(
+            (plugin: any) => plugin.name !== 'PROJECT'
+          );
+          return true;
+        }
+      }
+      return false;
+    });
+
+    const bundle = await rollup(config);
+    await bundle.write(config.output);
+
+    if (!fs.existsSync(fixturesDir)) {
+      fs.mkdirSync(fixturesDir);
+    }
+
+    // fs.writeFileSync(normalFixturePath, unshakedFixtureContent);
+    // fs.writeFileSync(treeshakedFixturePath, shakedFixtureContent);
+  }, 60000 * 2);
+
+  // clean the fixture
+  afterAll(() => {
+    // cleanFixture && fs.rmSync(fixturesDir, { recursive: true });
+  });
+
+  test('esbuild', () => {
+    console.log('hi');
+  }, 60000);
+});

packages/overlayscrollbars/test/jest-node/treeshaking.test.ts

@@ -1,21 +1,23 @@
 import path from 'path';
-import fs from 'fs';
+import fs from 'node:fs';
 import { rollup } from 'rollup';
 import { webpack } from 'webpack';
 import { build } from 'esbuild';
 import { terser } from 'rollup-plugin-terser';
 
+// @ts-ignore
 import pkg from '~/../package.json';
+// @ts-ignore
 import rollupConfig from '~/../rollup.config';
 
 const cleanBundle = true;
 const cleanFixture = true;
 const expectedBundleDiff = 2300;
 
-const normalizePath = (pathName) =>
+const normalizePath = (pathName: string) =>
   pathName ? pathName.split(path.sep).join(path.posix.sep) : pathName;
 
-const fixturesDir = path.join(__dirname, '.fixtures');
+const fixturesDir = path.join(__dirname, '.treeshakingFixtures');
 const libraryFixturePath = normalizePath(path.join(fixturesDir, 'lib.js'));
 const normalFixturePath = normalizePath(path.join(fixturesDir, 'nromal.js'));
 const treeshakedFixturePath = normalizePath(path.join(fixturesDir, 'treeshaked.js'));
@@ -29,7 +31,7 @@ const shakedFixtureContent = `
 `;
 
 const bundleFunctions = {
-  webpack: async (input, output) => {
+  webpack: async (input: string, output: string) => {
     const outputPath = path.dirname(output);
     const outputfilename = path.basename(output);
     const compiler = webpack({
@@ -45,19 +47,19 @@ const bundleFunctions = {
       },
     });
 
-    const result = await new Promise((resolve, reject) => {
+    const result = (await new Promise((resolve, reject) => {
       compiler.run((err, res) => {
         if (err) {
           return reject(err);
         }
         resolve(res);
       });
-    });
+    })) as any;
 
     return result.compilation.assetsInfo.get(outputfilename).size;
   },
-  rollup: async (input, output) => {
+  rollup: async (input: string, output: string) => {
-    const config = {
+    const config: any = {
       input,
       output: {
         format: 'iife',
@@ -71,7 +73,7 @@ const bundleFunctions = {
 
     return fs.statSync(config.output.file).size;
   },
-  esbuild: async (input, output) => {
+  esbuild: async (input: string, output: string) => {
     await build({
       entryPoints: [input],
       outfile: output,
@@ -86,7 +88,7 @@ const bundleFunctions = {
   },
 };
 
-const testBundler = (bundlerName) => async () => {
+const testBundler = (bundlerName: string) => async () => {
   const bundleFunction = bundleFunctions[bundlerName];
   const outputDir = path.join(__dirname, `.${bundlerName}`);
   const normal = await bundleFunction(
@@ -115,7 +117,7 @@ describe('tree shaking', () => {
   beforeAll(async () => {
     const { module } = pkg;
     const esmEntryFilename = path.basename(module);
-    const config = rollupConfig.find((inputConfig) => {
+    const config = rollupConfig.find((inputConfig: any) => {
       const { output } = inputConfig;
       if (output) {
         const outputArr = Array.isArray(output) ? output : [output];
@@ -124,7 +126,9 @@ describe('tree shaking', () => {
           inputConfig.output = outputConfig;
           inputConfig.output.sourcemap = false;
           inputConfig.output.file = libraryFixturePath;
-          inputConfig.plugins = inputConfig.plugins.filter((plugin) => plugin.name !== 'PROJECT');
+          inputConfig.plugins = inputConfig.plugins.filter(
+            (plugin: any) => plugin.name !== 'PROJECT'
+          );
           return true;
         }
       }

packages/overlayscrollbars/tsconfig.json

@@ -4,6 +4,6 @@
     "paths": {
       "~/*": ["./src/*"]
     },
-    "types": ["jest"],
+    "types": ["jest", "node"],
   }
 }