mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2024-11-04 01:10:49 +01:00
Import sortablejs
only once (#25936)
Previously, `sortablejs` was imported twice, once synchronously and once asynchronously, leading to webpack creating duplicate output code (once in the index bundle, and once in a separate chunk). Fix this by always asynchronously importing it. This was one of the build warnings observed when trying to build with vite.
This commit is contained in:
parent
d0a9456c4f
commit
8bb0a03eaa
3 changed files with 10 additions and 7 deletions
|
@ -2,9 +2,9 @@ import $ from 'jquery';
|
||||||
import {updateIssuesMeta} from './repo-issue.js';
|
import {updateIssuesMeta} from './repo-issue.js';
|
||||||
import {toggleElem} from '../utils/dom.js';
|
import {toggleElem} from '../utils/dom.js';
|
||||||
import {htmlEscape} from 'escape-goat';
|
import {htmlEscape} from 'escape-goat';
|
||||||
import {Sortable} from 'sortablejs';
|
|
||||||
import {confirmModal} from './comp/ConfirmModal.js';
|
import {confirmModal} from './comp/ConfirmModal.js';
|
||||||
import {showErrorToast} from '../modules/toast.js';
|
import {showErrorToast} from '../modules/toast.js';
|
||||||
|
import {createSortable} from '../modules/sortable.js';
|
||||||
|
|
||||||
function initRepoIssueListCheckboxes() {
|
function initRepoIssueListCheckboxes() {
|
||||||
const $issueSelectAll = $('.issue-checkbox-all');
|
const $issueSelectAll = $('.issue-checkbox-all');
|
||||||
|
@ -176,7 +176,7 @@ async function pinMoveEnd(e) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function initIssuePinSort() {
|
async function initIssuePinSort() {
|
||||||
const pinDiv = document.getElementById('issue-pins');
|
const pinDiv = document.getElementById('issue-pins');
|
||||||
|
|
||||||
if (pinDiv === null) return;
|
if (pinDiv === null) return;
|
||||||
|
@ -189,7 +189,7 @@ function initIssuePinSort() {
|
||||||
// If only one issue pinned, we don't need to make this Sortable
|
// If only one issue pinned, we don't need to make this Sortable
|
||||||
if (pinDiv.children.length < 2) return;
|
if (pinDiv.children.length < 2) return;
|
||||||
|
|
||||||
new Sortable(pinDiv, {
|
createSortable(pinDiv, {
|
||||||
group: 'shared',
|
group: 'shared',
|
||||||
animation: 150,
|
animation: 150,
|
||||||
ghostClass: 'card-ghost',
|
ghostClass: 'card-ghost',
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import $ from 'jquery';
|
import $ from 'jquery';
|
||||||
import {useLightTextOnBackground} from '../utils/color.js';
|
import {useLightTextOnBackground} from '../utils/color.js';
|
||||||
import tinycolor from 'tinycolor2';
|
import tinycolor from 'tinycolor2';
|
||||||
|
import {createSortable} from '../modules/sortable.js';
|
||||||
|
|
||||||
const {csrfToken} = window.config;
|
const {csrfToken} = window.config;
|
||||||
|
|
||||||
|
@ -55,12 +56,10 @@ async function initRepoProjectSortable() {
|
||||||
const els = document.querySelectorAll('#project-board > .board.sortable');
|
const els = document.querySelectorAll('#project-board > .board.sortable');
|
||||||
if (!els.length) return;
|
if (!els.length) return;
|
||||||
|
|
||||||
const {Sortable} = await import(/* webpackChunkName: "sortable" */'sortablejs');
|
|
||||||
|
|
||||||
// the HTML layout is: #project-board > .board > .board-column .board.cards > .board-card.card .content
|
// the HTML layout is: #project-board > .board > .board-column .board.cards > .board-card.card .content
|
||||||
const mainBoard = els[0];
|
const mainBoard = els[0];
|
||||||
let boardColumns = mainBoard.getElementsByClassName('board-column');
|
let boardColumns = mainBoard.getElementsByClassName('board-column');
|
||||||
new Sortable(mainBoard, {
|
createSortable(mainBoard, {
|
||||||
group: 'board-column',
|
group: 'board-column',
|
||||||
draggable: '.board-column',
|
draggable: '.board-column',
|
||||||
filter: '[data-id="0"]',
|
filter: '[data-id="0"]',
|
||||||
|
@ -89,7 +88,7 @@ async function initRepoProjectSortable() {
|
||||||
|
|
||||||
for (const boardColumn of boardColumns) {
|
for (const boardColumn of boardColumns) {
|
||||||
const boardCardList = boardColumn.getElementsByClassName('board')[0];
|
const boardCardList = boardColumn.getElementsByClassName('board')[0];
|
||||||
new Sortable(boardCardList, {
|
createSortable(boardCardList, {
|
||||||
group: 'shared',
|
group: 'shared',
|
||||||
animation: 150,
|
animation: 150,
|
||||||
ghostClass: 'card-ghost',
|
ghostClass: 'card-ghost',
|
||||||
|
|
4
web_src/js/modules/sortable.js
Normal file
4
web_src/js/modules/sortable.js
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
export async function createSortable(...args) {
|
||||||
|
const {Sortable} = await import(/* webpackChunkName: "sortablejs" */'sortablejs');
|
||||||
|
return new Sortable(...args);
|
||||||
|
}
|
Loading…
Reference in a new issue