Skip to content

Commit

Permalink
translated tutorial :3
Browse files Browse the repository at this point in the history
  • Loading branch information
exrem committed Aug 23, 2024
1 parent 41737dd commit 35919b0
Show file tree
Hide file tree
Showing 4 changed files with 109 additions and 101 deletions.
4 changes: 4 additions & 0 deletions docs/.vitepress/theme/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,10 @@
white-space: nowrap;
}

.vp-doc :not(pre) > code {
white-space: nowrap;
}

svg[id^='mermaid-'] {
line-height: 1.5;
background-color: transparent !important;
Expand Down
24 changes: 12 additions & 12 deletions docs/introduction/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ title: Giriş

## Ümumi baxış {#overview}

Rollup kiçik kod parçalarını kitabxana, yaxud tətbiq kimi daha böyük və daha mürəkkəb vahidlərə kompilyasiya edən JavaScript modul bandleridir. O, CommonJS və AMD kimi köhnə üsulların əvəzinə JavaScript-in ES6 nəşrindəki standart modul formatından istifadə edir. ES modulları sizə istədiyiniz kitabxanadan istədiyiniz funksiyaları azad və rahat şəkildə yığmağa şərait yaradır. Gələcəkdə doğma üsullarla bunu hər yerdə etmək mümkün olacaq, ancaq Rollup sizə bu fürsəti indidən verir.
Rollup kiçik kod parçalarını kitabxana, yaxud tətbiq kimi daha böyük və daha mürəkkəb vahidlərə kompilyasiya edən JavaScript modul bandleridir. O, CommonJS və AMD kimi köhnə üsulların əvəzinə JavaScript-in ES6 nəşrindəki standart modul formatından istifadə edir. ES modulları sizə istədiyiniz kitabxanadan istədiyiniz funksiyaları azad və rahat şəkildə yığmağa şərait yaradır. Gələcəkdə ("native") üsullarla bunu hər yerdə etmək mümkün olacaq, ancaq Rollup sizə bu fürsəti indidən verir.

## Quraşdırma {#installation}

Expand All @@ -18,7 +18,7 @@ npm install --global rollup

Bununla Rollup-ı qlobal komanda sətri aləti kimi quraşdırmaq mümkündür. Əgər istəsəniz, Rollup-ı [lokal şəkildə də quraşdıra bilərsiniz](../tutorial/index.md#installing-rollup-locally).

## Cəld Başlanğıc {#quick-start}
## Cəld başlanğıc {#quick-start}

Rollup-dan həm ixtiyari bir konfiqurasiya faylı ilə [komanda sətri interfeysi](../command-line-interface/index.md), həm də onun [JavaScript proqramlaşdırma interfeysi](../javascript-api/index.md) vasitəsilə istifadə edə bilərsiniz. Mümkün konfiqurasiya seçimləri və parametrlərini `rollup --help` komandası ilə görə bilərsiniz.

Expand All @@ -29,12 +29,12 @@ Bu komandalar ilə əsas giriş nöqtəsi `main.js` olan və bütün idxalatı `
::: code-group

```shell [Brauzerlər üçün:]
# öz-özünü işə salan funksiyanın (iife) mövcud olduğu <script> teqinə kompilyasiya edir
# öz-özünü işə salan funksiyanın ("iife") mövcud olduğu <script> teqinə kompilyasiya edir
$ rollup main.js --file bundle.js --format iife
```

```shell [Node.js üçün:]
# CommonJS moduluna (cjs) kompilyasiya edir
# CommonJS moduluna ("cjs") kompilyasiya edir
$ rollup main.js --file bundle.js --format cjs
```

Expand All @@ -45,44 +45,44 @@ $ rollup main.js --file bundle.js --format umd --name "myBundle"

:::

## Niyə Məhz Rollup {#the-why}
## Niyə məhz Rollup {#the-why}

Proyekti kiçik hissələrə böləndə proqram yazmaq, adətən, daha asan başa gəlir, çünki belə olan halda gözlənilməyən qarşılıqlı təsirlər və həll olunmalı problemlərin mürəkkəbliyi böyük ölçüdə azalır. Bununla belə, sadəcə kiçik ölçülü proyektlər yazmaq da [hər zaman çıxış yolu olmur](https://medium.com/@Rich_Harris/small-modules-it-s-not-quite-that-simple-3ca532d65de4). Təəssüf ki, JavaScript dilinin özülündə tarixən bu qabiliyyət mövcud olmayıb.

Bu, nəhayət, JavaScript-in ES6 nəşrində dəyişdi — data və funksiyaların ayrı-ayrı skriptlərdə istifadə edilə bilməsi məqsədilə idxal və ixracı üçün məqsədəuyğun sintaksis əlavə edildi. Bu spesifikasiya artıq qərarlaşdırılmış olsa da, yalnız müasir brauzerlər tərəfindən dəstəklənir və Node.js-də tamamlanmamışdır. Rollup sizə yeni modul sistemindən istifadə edərək kod yazmağınız üçün şərait yaradır. Yazdığınız kod isə CommonJS və AMD modulları, həmçinin öz-özünü işə salan skriptlərə kompilyasiya olunur. Beləliklə, siz _gələcəyə davamlı_ kod yaza bilərsiniz.

## Tri-Şeykinq {#tree-shaking}
## Tri-şeykinq {#tree-shaking}

ES modullarının istifadəsini mümkün etməkdən başqa, Rollup həmçinin sizin idxal etdiyiniz kodu statik analizini edir və istifadə edilməyən hissələri kənarlaşdırır. Bu isə sizə əlavə asılılıqlar əlavə etmədən, yaxud proyektin ölçüsündə güzəştə getmədən mövcud alətlər və modullarla kod yazmağınıza imkan yaradır.

Məsələn, CommonJS-də siz gərək bütün aləti, yaxud kitabxananı idxal edəsiniz.

```js
// CommonJS ilə bütün utils obyektini idxal edirsiniz
// CommonJS ilə bütün "utils" utilitlər obyektini idxal edirsiniz
const utils = require('./utils');
const query = 'Rollup';
// utilitler obyektinin ajax metodundan istifadə edirsiniz
// "utils" obyektinin "ajax" metodundan istifadə edirsiniz
utils.ajax(`https://api.example.com?search=${query}`).then(handleResponse);
```

ES modulları ilə isə bütün `utils` obyekti əvəzinə sadəcə bizə lazım olan `ajax` funksiyasını idxal edə bilərik:

```js
// ES6 idxal bəyanatı ilə ajax funksiyasını idxal edin
// ES6 idxal bəyanatı ilə "ajax" funksiyasını idxal edin
import { ajax } from './utils';
const query = 'Rollup';
// ajax funksiyasını işə salın
// "ajax" funksiyasını işə salın
ajax(`https://api.example.com?search=${query}`).then(handleResponse);
```

Rollup mümkün qədər minimal kod ehtiva etdiyi üçün daha yüngül, daha sürətli və daha az mürəkkəb kitabxanalar və tətbiqlər yaradır. Beləliklə, birbaşa `import``export` bəyanatlarından istifadə edildiyi üçün kompilyasiya edilmiş kodda istifadə edilməyən dəyişkənləri avtomatik kiçildici ilə aşkar etməkdən daha əlverişli bir üsul alınır.

## Uyğunluq {#compatibility}

### CommonJS İdxalatı {#importing-commonjs}
### CommonJS idxalatı {#importing-commonjs}

Rollup [plagin vasitəsilə](https://github.com/rollup/plugins/tree/master/packages/commonjs) mövcud CommonJS modullarını idxal edə bilər.

### ES Modullarının Yayımlanması {#publishing-es-modules}
### ES modullarının yayımlanması {#publishing-es-modules}

ES modullarınızın Node.js, yaxud webpack kimi CommonJS ilə işləyən alətlər tərəfindən istifadə edilə bilməsini təmin etmək üçün Rollup ilə UMD, yaxud CommonJS formatlarına kompilyasiya edib `package.json` faylındakı `main` parametrinə həmin kompilyasiya edilmiş faylı təyin edə bilərsiniz. Əgər `package.json` faylınızda `module` da təyin edilibsə, [webpack 2+](https://webpack.js.org/) və Rollup kimi ES modulunu tanıyan alətlər [birbaşa ES modulunu idxal edəcək](https://github.com/rollup/rollup/wiki/pkg.module).
12 changes: 6 additions & 6 deletions docs/javascript-api/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ Rollup sizə Node.js-də istifadə edə biləcəyiniz JavaScript proqramlaşdır

`bundle` obyekti ilə işiniz bitəndən sonra isə `bundle.close` funksiyasını işə salmalısınız ki, plaginlər [`closeBundle`](../plugin-development/index.md#closebundle) qarmağı ("hook") ilə xarici prosesləri və xidmətləri təmizləyə bilsin.

Əgər haradasa xəta baş versə, Rollup `Error` ilə imtina edilmiş vəd qaytaracaq, siz də bu zaman `code` parametri vasitəsilə problemi müəyyənləşdirə biləcəksiniz. Bir çox xətalar xüsusi raportlaşdırma zamanı istifadə edə bilməyiniz üçün `code``message`dən başqa parametlərə də sahibdir. Xətaların və qeydlərin kodları və parametrləri ilə birlikdə tam siyahısına [`utils/logs.ts`](https://github.com/rollup/rollup/blob/master/src/utils/logs.ts) faylında baxa bilərsiniz.
Əgər haradasa xəta baş versə, Rollup `Error` ilə imtina edilmiş vəd qaytaracaq, siz də bu zaman `code` parametri vasitəsilə problemi müəyyənləşdirə biləcəksiniz. Bir çox xətalar xüsusi raportlaşdırma zamanı istifadə edə bilməyiniz üçün `code``message`-dən başqa parametlərə də sahibdir. Xətaların və qeydlərin kodları və parametrləri ilə birlikdə tam siyahısına [`utils/logs.ts`](https://github.com/rollup/rollup/blob/master/src/utils/logs.ts) faylında baxa bilərsiniz.

<!-- prettier-ignore-start -->
```javascript twoslash
Expand Down Expand Up @@ -79,7 +79,7 @@ async function generateOutputs(bundle) {
for (const outputOptions of outputOptionsList) {
// xüsusi yaddaşdaxili çıxış kodu yaradın
// bu funksiyanı eyni bandl obyekti üzərində bir neçə dəfə işə salmaq mümkündür
// birbaşa diskə yazmaq üçün bundle.generate əvəzinə bundle.write istifadə edin
// birbaşa diskə yazmaq üçün "bundle.generate" əvəzinə "bundle.write" funksiyasından istifadə edə bilərsiniz
const { output } = await bundle.generate(outputOptions);

for (const chunkOrAsset of output) {
Expand Down Expand Up @@ -116,8 +116,8 @@ async function generateOutputs(bundle) {
// };
// },
// name: string // adlandırma sxemlərində blokun adı
// preliminaryFileName: string // çözənək yertutucular ilə faylın ilkin adı
// referencedFiles: string[] // import.meta.ROLLUP_FILE_URL_<id> ilə istinad edilən fayllar
// preliminaryFileName: string // çözənək ("hash") yertutucular daxil edilməklə faylın ilkin adı
// referencedFiles: string[] // "import.meta.ROLLUP_FILE_URL_<id>" ilə istinad edilən fayllar
// type: 'chunk', // obyektin blok olduğunu göstərir
// }
console.log('Chunk', chunkOrAsset.modules);
Expand Down Expand Up @@ -260,9 +260,9 @@ watcher.on('event', event => {
// * event.output — yaradılan çıxışların "file", yaxud "dir"
// seçimlərinin dəyərlərindən ibarət siyahı
// * event.duration — inşa müddəti (millisaniyə ilə)
// * event.result — bundle.generate, yaxud bundle.write
// * event.result — "bundle.generate", yaxud "bundle.write"
// işə salınaraq əlavə çıxışlar yaratmaq üçün
// istifadə edilə biləcək bandl obyekti. Bu, watch.skipWrite
// istifadə edilə biləcək bandl obyekti. Bu, "watch.skipWrite"
// aktiv olan zaman xüsusi əhəmiyyət kəsb edir.
// Əgər daha yeni çıxış yaratmayacaqsınızsa, gərək
// "event.result.close" funksiyasını işə salasınız.
Expand Down
Loading

0 comments on commit 35919b0

Please sign in to comment.