Merhaba,
bootsrap-fileinput paketini npm aracılığı ile indirdim. İçeriğini override etmek istiyorum ama mantık hatası mı yapıyorum anlayamadım.
Paket içerisinde bulunan kırmızı renkteki alanı değiştirmek istiyorum. Sarı alanı da kaldırmak istiyorum.
https://www.hizliresim.com/3n5qyfm
resources/fileinput.js
import '../../public/assets/css/fileinput.css';
import fileinput from 'bootstrap-fileinput';
window.fileinput = fileinput;
jQuery.fn.extend(window.fileinput, {
fileinputLocales: {
en: {
sizeUnits: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
bitRateUnits: ['B/s', 'KB/s', 'MB/s', 'GB/s', 'TB/s', 'PB/s', 'EB/s', 'ZB/s', 'YB/s'],
fileSingle: 'file',
filePlural: 'files',
browseLabel: 'Gözat …',
removeLabel: 'Sil',
removeTitle: 'Clear all unprocessed files',
cancelLabel: 'Cancel',
cancelTitle: 'Abort ongoing upload',
pauseLabel: 'Pause',
pauseTitle: 'Pause ongoing upload',
uploadLabel: 'Upload',
uploadTitle: 'Upload selected files',
msgNo: 'No',
msgNoFilesSelected: 'No files selected',
msgCancelled: 'Cancelled',
msgPaused: 'Paused',
msgPlaceholder: 'Select {files} ...',
msgZoomModalHeading: 'Detailed Preview',
msgFileRequired: 'You must select a file to upload.',
msgSizeTooSmall: 'File "{name}" (<b>{size}</b>) is too small and must be larger than <b>{minSize}</b>.',
msgSizeTooLarge: 'File "{name}" (<b>{size}</b>) exceeds maximum allowed upload size of <b>{maxSize}</b>.',
msgFilesTooLess: 'You must select at least <b>{n}</b> {files} to upload.',
msgFilesTooMany: 'Number of files selected for upload <b>({n})</b> exceeds maximum allowed limit of <b>{m}</b>.',
msgTotalFilesTooMany: 'You can upload a maximum of <b>{m}</b> files (<b>{n}</b> files detected).',
msgFileNotFound: 'File "{name}" not found!',
msgFileSecured: 'Security restrictions prevent reading the file "{name}".',
msgFileNotReadable: 'File "{name}" is not readable.',
msgFilePreviewAborted: 'File preview aborted for "{name}".',
msgFilePreviewError: 'An error occurred while reading the file "{name}".',
msgInvalidFileName: 'Invalid or unsupported characters in file name "{name}".',
msgInvalidFileType: 'Invalid type for file "{name}". Only "{types}" files are supported.',
msgInvalidFileExtension: 'Invalid extension for file "{name}". Only "{extensions}" files are supported.',
msgFileTypes: {
'image': 'image',
'html': 'HTML',
'text': 'text',
'video': 'video',
'audio': 'audio',
'flash': 'flash',
'pdf': 'PDF',
'object': 'object'
},
msgUploadAborted: 'The file upload was aborted',
msgUploadThreshold: 'Processing …',
msgUploadBegin: 'Initializing …',
msgUploadEnd: 'Done',
msgUploadResume: 'Resuming upload …',
msgUploadEmpty: 'No valid data available for upload.',
msgUploadError: 'Upload Error',
msgDeleteError: 'Delete Error',
msgProgressError: 'Error',
msgValidationError: 'Validation Error',
msgLoading: 'Loading file {index} of {files} …',
msgProgress: 'Loading file {index} of {files} - {name} - {percent}% completed.',
msgSelected: '{n} {files} selected',
msgProcessing: 'Processing ...',
msgFoldersNotAllowed: 'Drag & drop files only! {n} folder(s) dropped were skipped.',
msgImageWidthSmall: 'Width of image file "{name}" must be at least <b>{size} px</b> (detected <b>{dimension} px</b>).',
msgImageHeightSmall: 'Height of image file "{name}" must be at least <b>{size} px</b> (detected <b>{dimension} px</b>).',
msgImageWidthLarge: 'Width of image file "{name}" cannot exceed <b>{size} px</b> (detected <b>{dimension} px</b>).',
msgImageHeightLarge: 'Height of image file "{name}" cannot exceed <b>{size} px</b> (detected <b>{dimension} px</b>).',
msgImageResizeError: 'Could not get the image dimensions to resize.',
msgImageResizeException: 'Error while resizing the image.<pre>{errors}</pre>',
msgAjaxError: 'Something went wrong with the {operation} operation. Please try again later!',
msgAjaxProgressError: '{operation} failed',
msgDuplicateFile: 'File "{name}" of same size "{size}" has already been selected earlier. Skipping duplicate selection.',
msgResumableUploadRetriesExceeded: 'Upload aborted beyond <b>{max}</b> retries for file <b>{file}</b>! Error Details: <pre>{error}</pre>',
msgPendingTime: '{time} remaining',
msgCalculatingTime: 'calculating time remaining',
ajaxOperations: {
deleteThumb: 'file delete',
uploadThumb: 'file upload',
uploadBatch: 'batch file upload',
uploadExtra: 'form data upload'
},
dropZoneTitle: 'Drag & drop files here …',
dropZoneClickTitle: '<br>(or click to select {files})',
previewZoomButtonTitles: {
prev: 'View previous file',
next: 'View next file',
rotate: 'Rotate 90 deg. clockwise',
toggleheader: 'Toggle header',
fullscreen: 'Toggle full screen',
borderless: 'Toggle borderless mode',
close: 'Close detailed preview'
}
}
}
});
vite.config.js
import {defineConfig} from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
server: {
host: '0.0.0.0',
hmr: {
host: 'localhost',
},
},
plugins: [
laravel({
input: [
'resources/js/fileinput.js',
'resources/js/select2.js',
'resources/js/app.js',
],
refresh: true
}),
],
});
Bu şekilde bir kullanım hiç yapmadığım için takıldım. Eğer bu şekilde yapılamıyorsa paketi manuel indirip düzeltip o şekilde vite içerisinden geçireceğim.