diff --git a/.gitignore b/.gitignore index a547bf36..19a1e8af 100644 --- a/.gitignore +++ b/.gitignore @@ -22,3 +22,6 @@ dist-ssr *.njsproj *.sln *.sw? + + +playwright-report/ diff --git a/package.json b/package.json index 4853a67b..7ffde812 100644 --- a/package.json +++ b/package.json @@ -64,7 +64,10 @@ "scripts": { "dev": "vite", "preview": "vite preview", - "build:lib": "vite build --config vite.config.lib.mjs", + "build:lib": "npm run build:lib:clean && npm run build:lib:unminified && npm run build:lib:minified", + "build:lib:clean": "rm -rf dist", + "build:lib:unminified": "vite build --config vite.config.lib.mjs --mode production", + "build:lib:minified": "vite build --config vite.config.lib.mjs --mode production-minified", "build": "npm-run-all -p build:icons build:demo", "prebuild": "npm run build:lib", "postbuild": "npm run generate:jsonSchema", diff --git a/src/lib/js/constants.js b/src/lib/js/constants.js index 84246cbd..3d72d99f 100644 --- a/src/lib/js/constants.js +++ b/src/lib/js/constants.js @@ -13,9 +13,15 @@ export const POLYFILLS = [ { name: 'mutationObserver', src: '//cdn.jsdelivr.net/npm/mutationobserver-shim/dist/mutationobserver.min.js' }, { name: 'fetch', src: 'https://unpkg.com/unfetch/polyfill' }, ] -export const SVG_SPRITE_URL = env?.PROD - ? `https://cdn.jsdelivr.net/npm/formeo@${version}/dist/${formeoSpriteId}.svg` - : resolve(`../../lib/icons/${formeoSpriteId}.svg`) + +const relativeSpritePath = `../../lib/icons/${formeoSpriteId}.svg` +const localSpriteUrl = typeof resolve === 'function' + ? resolve(relativeSpritePath) + : relativeSpritePath + +export const SVG_SPRITE_URL = env?.DEV + ? localSpriteUrl + : `https://cdn.jsdelivr.net/npm/formeo@${version}/dist/${formeoSpriteId}.svg` export const FALLBACK_SVG_SPRITE_URL = `https://draggable.github.io/formeo/assets/img/${formeoSpriteId}.svg` export const CSS_URL = `https://cdn.jsdelivr.net/npm/formeo@${version}/dist/formeo.min.css` export const FALLBACK_CSS_URL = 'https://draggable.github.io/formeo/assets/css/formeo.min.css' diff --git a/tools/copy-assets.mjs b/tools/copy-assets.mjs index 73a0c9c9..7d6f1a67 100644 --- a/tools/copy-assets.mjs +++ b/tools/copy-assets.mjs @@ -24,13 +24,12 @@ const targets = [ }, { src: resolve(projectRoot, 'dist/formeo.umd.js'), - dest: resolve(projectRoot, 'dist/demo/assets/js/'), + dest: resolve(projectRoot, 'dist/'), rename: 'formeo.min.js', }, { - src: resolve(projectRoot, 'dist/formeo.umd.js'), - dest: resolve(projectRoot, 'dist/'), - rename: 'formeo.min.js', + src: resolve(projectRoot, 'dist/*.js'), + dest: resolve(projectRoot, 'dist/demo/assets/js/'), }, { src: resolve(projectRoot, 'dist/formeo.min.css'), diff --git a/vite.config.lib.mjs b/vite.config.lib.mjs index 05bdfd02..1bbbb708 100644 --- a/vite.config.lib.mjs +++ b/vite.config.lib.mjs @@ -12,40 +12,44 @@ Author: ${pkg.author} */ ` -export default defineConfig({ - root: './', - build: { - lib: { - entry: resolve(__dirname, 'src/lib/js/index.js'), - name: 'formeo', - fileName: format => `[name].${format}.js`, - formats: ['es', 'cjs', 'umd'], - }, - outDir: 'dist', - emptyOutDir: true, - minify: 'terser', - terserOptions: { - compress: { - drop_console: true, - drop_debugger: true, - }, - }, - rollupOptions: { - input: { - formeo: resolve(__dirname, 'src/lib/js/index.js'), +export default defineConfig(({ mode }) => { + const isMinified = mode === 'production-minified' + + return { + root: './', + build: { + lib: { + entry: resolve(__dirname, 'src/lib/js/index.js'), + name: 'formeo', + fileName: format => isMinified ? `[name].min.${format}.js` : `[name].${format}.js`, + formats: ['es', 'cjs', 'umd'], }, - output: { - assetFileNames: 'formeo.min.[ext]', - inlineDynamicImports: true, + outDir: 'dist', + emptyOutDir: false, // Don't empty on each build to preserve both versions + minify: isMinified ? 'terser' : false, + terserOptions: isMinified ? { + compress: { + drop_console: true, + drop_debugger: true, + }, + } : undefined, + rollupOptions: { + input: { + formeo: resolve(__dirname, 'src/lib/js/index.js'), + }, + output: { + assetFileNames: isMinified ? 'formeo.min.[ext]' : 'formeo.[ext]', + inlineDynamicImports: true, + }, }, }, - }, - plugins: [banner(bannerTemplate)], - css: { - preprocessorOptions: { - scss: { - api: 'modern-compiler', + plugins: [banner(bannerTemplate)], + css: { + preprocessorOptions: { + scss: { + api: 'modern-compiler', + }, }, }, - }, + } })