Skip to content

Commit a267785

Browse files
nolimits4webnolimits4web
committed
feat: rework package to use .mjs files and all scripts and styles are minified
1 parent 3789a9d commit a267785

File tree

140 files changed

+435
-416
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

140 files changed

+435
-416
lines changed

‎scripts/build-modules.js

Lines changed: 48 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -14,33 +14,33 @@ export default async function buildModules() {
1414
const modules = [];
1515
configModules.forEach((name) => {
1616
const capitalized = capitalizeString(name);
17-
const jsFilePath = `./src/modules/${name}/${name}.js`;
17+
const jsFilePath = `./src/modules/${name}/${name}.mjs`;
1818
if (fs.existsSync(jsFilePath)) {
1919
modules.push({ name, capitalized });
2020
}
2121
});
2222

2323
// eslint-disable-next-line
2424
const modulesPaths = configModules.map((name) => {
25-
return `./src/modules/${name}/${name}.js`;
25+
return `./src/modules/${name}/${name}.mjs`;
2626
});
2727

2828
const output = await rollup({
2929
external: ['react', 'vue'],
3030
input: [
31-
'./src/swiper.js',
32-
'./src/swiper-bundle.js',
33-
'./src/swiper-element.js',
34-
'./src/swiper-element-bundle.js',
35-
'./src/swiper-vue.js',
36-
'./src/swiper-react.js',
31+
'./src/swiper.mjs',
32+
'./src/swiper-bundle.mjs',
33+
'./src/swiper-element.mjs',
34+
'./src/swiper-element-bundle.mjs',
35+
'./src/swiper-vue.mjs',
36+
'./src/swiper-react.mjs',
3737
...modulesPaths,
3838
],
3939
plugins: [
4040
replace({
4141
delimiters: ['', ''],
4242
'//IMPORT_MODULES': modules
43-
.map((mod) => `import ${mod.capitalized} from './modules/${mod.name}/${mod.name}.js';`)
43+
.map((mod) => `import ${mod.capitalized} from './modules/${mod.name}/${mod.name}.mjs';`)
4444
.join('\n'),
4545
'//INSTALL_MODULES': modules.map((mod) => `${mod.capitalized}`).join(',\n '),
4646
'//EXPORT': 'export default Swiper; export { Swiper }',
@@ -54,10 +54,11 @@ export default async function buildModules() {
5454
await output.write({
5555
dir: `./dist/tmp`,
5656
format: 'esm',
57+
entryFileNames: '[name].mjs',
5758
hoistTransitiveImports: false,
5859
chunkFileNames: (i) => {
59-
if (i.name === 'swiper') return `swiper-core.js`;
60-
return `[name].js`;
60+
if (i.name === 'swiper') return `swiper-core.mjs`;
61+
return `[name].mjs`;
6162
},
6263
});
6364

@@ -67,24 +68,21 @@ export default async function buildModules() {
6768
fs.mkdirSync(`./dist/modules`);
6869
}
6970
files.forEach((fileName) => {
70-
const folderName = fileName.split('.js')[0];
71+
const folderName = fileName.split('.mjs')[0];
7172
if (fs.existsSync(`./src/modules/${folderName}`)) {
72-
if (!fs.existsSync(`./dist/modules/${folderName}`)) {
73-
fs.mkdirSync(`./dist/modules/${folderName}`);
74-
}
75-
fs.copyFileSync(`./dist/tmp/${fileName}`, `./dist/modules/${folderName}/${fileName}`);
73+
fs.copyFileSync(`./dist/tmp/${fileName}`, `./dist/modules/${fileName}`);
7674
fs.unlinkSync(`./dist/tmp/${fileName}`);
7775
} else if (
78-
(fileName.indexOf('swiper-') !== 0 && fileName !== 'swiper.js') ||
79-
fileName === 'swiper-core.js'
76+
(fileName.indexOf('swiper-') !== 0 && fileName !== 'swiper.mjs') ||
77+
fileName === 'swiper-core.mjs'
8078
) {
8179
if (!fs.existsSync('./dist/shared')) {
8280
fs.mkdirSync('./dist/shared');
8381
}
8482
fs.copyFileSync(`./dist/tmp/${fileName}`, `./dist/shared/${fileName}`);
8583
fs.unlinkSync(`./dist/tmp/${fileName}`);
8684
} else {
87-
fs.copyFileSync(`./dist/tmp/${fileName}`, `./dist/${fileName.replace('.js', '.mjs')}`);
85+
fs.copyFileSync(`./dist/tmp/${fileName}`, `./dist/${fileName}`);
8886
fs.unlinkSync(`./dist/tmp/${fileName}`);
8987
}
9088
});
@@ -93,12 +91,14 @@ export default async function buildModules() {
9391
}
9492

9593
// FIX IMPORTS
96-
fs.readdirSync('./dist/modules').forEach((modName) => {
97-
const content = fs
98-
.readFileSync(`./dist/modules/${modName}/${modName}.js`, 'utf-8')
99-
.replace(/from '\.\//g, `from '../../shared/`);
100-
fs.writeFileSync(`./dist/modules/${modName}/${modName}.js`, content);
101-
});
94+
fs.readdirSync('./dist/modules')
95+
.filter((f) => f.includes('.mjs'))
96+
.forEach((modName) => {
97+
const content = fs
98+
.readFileSync(`./dist/modules/${modName}`, 'utf-8')
99+
.replace(/from '\.\//g, `from '../shared/`);
100+
fs.writeFileSync(`./dist/modules/${modName}`, content);
101+
});
102102

103103
const { core, bundle, slide } = await getElementStyles();
104104

@@ -110,8 +110,8 @@ export default async function buildModules() {
110110
content = content
111111
.replace(/from '\.\/swiper-core/g, `from './shared/swiper-core`)
112112
.replace(
113-
/import ([0-9A-Za-z]*) from '\.\/([0-9a-z-]*).js'/g,
114-
`import $1 from './modules/$2/$2.js'`,
113+
/import ([0-9A-Za-z]*) from '\.\/([0-9a-z-]*).mjs'/g,
114+
`import $1 from './modules/$2.mjs'`,
115115
);
116116
} else {
117117
content = content.replace(/from '\.\//g, `from './shared/`);
@@ -140,25 +140,30 @@ export default async function buildModules() {
140140
fs.writeFileSync(`./dist/${f}`, `${banner(bannerName)}\n${content}`);
141141
});
142142

143+
// MODULES_INDEX
144+
fs.writeFileSync(
145+
'./dist/modules/index.mjs',
146+
modules
147+
.map((mod) => `export {default as ${mod.capitalized}} from './${mod.name}.mjs';`)
148+
.join('\n'),
149+
);
150+
143151
// MINIFY
144152
await Promise.all([
145153
// MINIFY SHARED
146154
...fs
147155
.readdirSync('./dist/shared')
148-
.filter((f) => f.endsWith('.js') && !f.includes('.min'))
149-
.map((f) => minify(f, `./dist/shared/${f}`, true)),
156+
.filter((f) => f.endsWith('.mjs'))
157+
.map((f) => minify(f, `./dist/shared/${f}`)),
150158
// MINIFY MODULES
151159
...fs
152160
.readdirSync('./dist/modules')
153-
.filter((f) => f.endsWith('.js') && !f.includes('.min'))
154-
.map((f) => minify(f, `./dist/modules/${f}/${f}.js`, true)),
161+
.filter((f) => f.endsWith('.mjs'))
162+
.map((f) => minify(f, `./dist/modules/${f}`)),
155163
// MINIFY ROOT
156164
...fs
157165
.readdirSync('./dist/')
158-
.filter(
159-
(f) =>
160-
f.endsWith('.mjs') && !f.includes('.min') && !f.includes('react') && !f.includes('vue'),
161-
)
166+
.filter((f) => f.endsWith('.mjs') && !f.includes('react') && !f.includes('vue'))
162167
.map((f) => {
163168
const bannerName = f.includes('react')
164169
? 'React'
@@ -167,21 +172,20 @@ export default async function buildModules() {
167172
: f.includes('element')
168173
? 'Custom Element'
169174
: '';
170-
return minify(f, `./dist/${f}`, false, bannerName);
175+
return minify(f, `./dist/${f}`, bannerName);
171176
}),
172177
]);
173178

174179
// IIFE
175180
const replaceExports = {};
176181
['swiper-bundle.mjs', 'swiper.mjs'].forEach((f) => {
177182
const content = fs.readFileSync(`./dist/${f}`, 'utf-8');
178-
const line = content
179-
.split('\n')
180-
.filter((l) => l.includes('export {'))[0]
181-
.trim();
183+
const before = content.match(/export{([^,]*),([^}]*)}/)[0];
184+
const after = before.replace(/export{([^,]*),([^}]*)}/, `export {$2}`);
185+
182186
replaceExports[f] = {
183-
before: line,
184-
after: line.replace(/export { ([^,]*), ([^}]*) }/, `export { $2 }`),
187+
before,
188+
after,
185189
};
186190
fs.writeFileSync(
187191
`./dist/${f}`,
@@ -198,7 +202,7 @@ export default async function buildModules() {
198202
replace({
199203
preventAssignment: true,
200204
delimiters: ['', ''],
201-
'export { SwiperContainer, SwiperSlide, register };': 'register()',
205+
'export{SwiperContainer,SwiperSlide,register};': 'register();',
202206
}),
203207
],
204208
});
@@ -224,7 +228,7 @@ export default async function buildModules() {
224228
await Promise.all(
225229
['swiper-bundle.js', 'swiper.js', 'swiper-element.js', 'swiper-element-bundle.js'].map((f) => {
226230
const bannerName = f.includes('element') ? 'Custom Element' : '';
227-
return minify(f, `./dist/${f}`, false, bannerName);
231+
return minify(f, `./dist/${f}`, bannerName);
228232
}),
229233
);
230234
}

‎scripts/build-styles.js

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,7 @@ const buildCSS = async ({ isBundle, modules, minified }) => {
4545
let lessContent = await fs.readFile(path.resolve(__dirname, '../src/swiper.less'), 'utf8');
4646
lessContent = lessContent.replace(
4747
'//IMPORT_MODULES',
48-
!isBundle
49-
? ''
50-
: modules.map((mod) => `@import url('./modules/${mod}/${mod}.less');`).join('\n'),
48+
!isBundle ? '' : modules.map((mod) => `@import url('./modules/${mod}.less');`).join('\n'),
5149
);
5250
const cssContent = await autoprefixer(
5351
await less(lessContent, path.resolve(__dirname, '../src')),
@@ -62,14 +60,14 @@ const buildCSS = async ({ isBundle, modules, minified }) => {
6260

6361
if (minified) {
6462
const minifiedContent = await minifyCSS(cssContent);
65-
await fs.writeFile(`./${outputDir}/${fileName}.min.css`, `${banner()}\n${minifiedContent}`);
63+
await fs.writeFile(`./${outputDir}/${fileName}.css`, `${banner()}\n${minifiedContent}`);
6664
}
6765
};
6866
export default async function buildStyles() {
6967
elapsed.start('styles');
7068
// eslint-disable-next-line import/no-named-as-default-member
7169
const modules = config.modules.filter((name) => {
72-
const lessFilePath = `./src/modules/${name}/${name}.less`;
70+
const lessFilePath = `./src/modules/${name}.less`;
7371
return fs.existsSync(lessFilePath);
7472
});
7573
buildCSS({ isBundle: true, modules, minified: isProd });
@@ -84,12 +82,16 @@ export default async function buildStyles() {
8482
);
8583
await Promise.all(
8684
files.map(async (file) => {
87-
const distFilePath = path.resolve(__dirname, `../${outputDir}`, file);
85+
let distFilePath = path.resolve(__dirname, `../${outputDir}`, file);
8886
const srcFilePath = path.resolve(__dirname, '../src', file);
8987
let distFileContent = await readSwiperFile(srcFilePath);
88+
distFileContent = distFileContent.replace('../../swiper-vars', '../swiper-vars');
9089
if (file === 'swiper.scss' || file === 'swiper.less') {
9190
distFileContent = `${banner()}\n${distFileContent}`;
9291
}
92+
if (distFilePath.includes('/modules/')) {
93+
distFilePath = distFilePath.replace(/modules\/([a-zA-Z0-9-]*)/, 'modules');
94+
}
9395
await fs.ensureDir(path.dirname(distFilePath));
9496
await fs.writeFile(distFilePath, distFileContent);
9597
}),
@@ -110,8 +112,8 @@ export default async function buildStyles() {
110112
const resultFilePath = filePath.replace(/\.less$/, '');
111113
const minifiedCSS = await minifyCSS(resultCSS);
112114
const minifiedCSSElement = await minifyCSS(resultCSSElement);
113-
await fs.writeFile(`${resultFilePath}.min.css`, minifiedCSS);
114-
await fs.writeFile(`${resultFilePath}-element.min.css`, minifiedCSSElement);
115+
await fs.writeFile(`${resultFilePath}.css`, minifiedCSS);
116+
await fs.writeFile(`${resultFilePath}-element.css`, minifiedCSSElement);
115117
}),
116118
);
117119
}

‎scripts/build-types.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export default async function buildTypes() {
6565
const eventsFiles = await globby('src/types/modules/*.d.ts');
6666
await Promise.all(
6767
eventsFiles.map(async (eventsFile) => {
68-
if (eventsFile.indexOf('public-api') > -1) {
68+
if (eventsFile.indexOf('public-api') > -1 || eventsFile.indexOf('index') > -1) {
6969
return;
7070
}
7171
let eventsContent = await fs.readFile(eventsFile, 'utf-8');

‎scripts/utils/minify.js

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,16 @@ import { minify } from 'terser';
22
import fs from 'fs';
33
import { banner } from './banner.js';
44

5-
export default async (fileName, filePath, inPlace, bannerName) => {
5+
export default async (fileName, filePath, bannerName, sourceMap) => {
66
const content = fs.readFileSync(filePath, 'utf-8');
77
const fileExt = fileName.includes('.mjs') ? '.mjs' : '.js';
88
const { code, map } = await minify(content, {
9-
...(inPlace
9+
...(!sourceMap
1010
? {}
1111
: {
1212
sourceMap: {
13-
filename: `${fileName}.min${fileExt}`,
14-
url: `${fileName}.min${fileExt}.map`,
13+
filename: `${fileName}.mjs`,
14+
url: `${fileName}.mjs.map`,
1515
},
1616
}),
1717

@@ -21,10 +21,8 @@ export default async (fileName, filePath, inPlace, bannerName) => {
2121
}).catch((err) => {
2222
console.error(`Terser failed on file ${fileName}: ${err.toString()}`);
2323
});
24-
if (inPlace) {
25-
fs.writeFileSync(filePath, code);
26-
} else {
27-
fs.writeFileSync(filePath.replace(`${fileExt}`, `.min${fileExt}`), code);
28-
fs.writeFileSync(filePath.replace(`${fileExt}`, `.min${fileExt}.map`), map);
24+
fs.writeFileSync(filePath, code);
25+
if (sourceMap) {
26+
fs.writeFileSync(filePath.replace(`${fileExt}`, `.mjs.map`), map);
2927
}
3028
};

‎src/components-shared/get-changed-params.js renamed to ‎src/components-shared/get-changed-params.mjs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { paramsList } from './params-list.js';
2-
import { isObject } from './utils.js';
1+
import { paramsList } from './params-list.mjs';
2+
import { isObject } from './utils.mjs';
33

44
function getChangedParams(swiperParams, oldParams, children, oldChildren, getKey) {
55
const keys = [];

‎src/components-shared/get-params.js renamed to ‎src/components-shared/get-params.mjs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { Swiper } from '../swiper.js';
2-
import { isObject, extend } from './utils.js';
3-
import { paramsList } from './params-list.js';
1+
import { Swiper } from '../swiper.mjs';
2+
import { isObject, extend } from './utils.mjs';
3+
import { paramsList } from './params-list.mjs';
44

55
function getParams(obj = {}, splitEvents = true) {
66
const params = {

‎src/components-shared/mount-swiper.js renamed to ‎src/components-shared/mount-swiper.mjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { needsNavigation, needsPagination, needsScrollbar } from './utils.js';
1+
import { needsNavigation, needsPagination, needsScrollbar } from './utils.mjs';
22

33
function mountSwiper({ el, nextEl, prevEl, paginationEl, scrollbarEl, swiper }, swiperParams) {
44
if (needsNavigation(swiperParams) && nextEl && prevEl) {

‎src/components-shared/params-list.js renamed to ‎src/components-shared/params-list.mjs

File renamed without changes.

‎src/components-shared/update-on-virtual-data.js renamed to ‎src/components-shared/update-on-virtual-data.mjs

File renamed without changes.

‎src/components-shared/update-swiper.js renamed to ‎src/components-shared/update-swiper.mjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { isObject, extend } from './utils.js';
1+
import { isObject, extend } from './utils.mjs';
22

33
function updateSwiper({
44
swiper,

0 commit comments

Comments
 (0)