Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Translating to Arabic #30

Merged
merged 13 commits into from
Feb 16, 2021
8 changes: 4 additions & 4 deletions src/v2/guide/class-and-style.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ order: 6
<div v-bind:class="{ active: isActive }"></div>
```

الصيغة بالأعلى تعني ان الفئة `active` سوف يتم تحديدها طبقاً لحقيقة القيمة [truthiness](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) الموجودة في خاصية البينات `isActive`.
الصيغة بالأعلى تعني ان الفئة `active` سوف يتم تحديدها طبقاً لحقيقة القيمة [truthiness](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) الموجودة في خاصية البيانات `isActive`.

يمكنك استخدام وتبديل العديد من الفئات عن طريق استخدام العديد من الحقول الاخرى. بالاضافة الى ذلك، الموجه `v-bind:class` يمكن ان يستخدم مع خاصية العنصر `class`. كما في المثال التالي:

Expand Down Expand Up @@ -111,7 +111,7 @@ data: {
<div v-bind:class="[{ active: isActive }, errorClass]"></div>
```

### الاستخدام مع الموكنات
### الاستخدام مع المكونات

> هذا القسم يفترض ان لديك معرفة بـ[مكونات Vue](components.html). لك مطلق الحرية في تخطي هذا الجزء والعودة إليه لاحقاً.

Expand Down Expand Up @@ -197,11 +197,11 @@ data: {

> 2.3.0+

بدئاً من الاصدار 2.3.0 يمكنك توفير مصفوفة مكونة من مجموعة من القيم (التي لها باطئة) لأنماط الخاصية، على سبيل المثال:
بدئاً من الاصدار 2.3.0 يمكنك توفير مصفوفة مكونة من مجموعة من القيم (التي لها بادئة) لأنماط الخاصية، على سبيل المثال:

``` html
<div v-bind:style="{ display: ['-webkit-box', '-ms-flexbox', 'flex'] }"></div>
```
هذا سوف قوم بمعالجة القيمة الاخيرة فقط في المصفوفة والتي يدعمها المستعرض. في هذا المثال، سوف يقوم بمعالجة `display: flex` للمستعرضات التي لا تدعم اصدار flexbox ذو البادئات

This will only render the last value in the array which the browser supports. In this example, it will render `display: flex` for browsers that support the unprefixed version of flexbox.
سيؤدي هذا فقط إلى عرض القيمة الأخيرة في المصفوفة التي يدعمها المتصفح. في هذا المثال ،سيتم عرض `display: flex` للمتصفحات التي تدعم الإصدار غير المثبت من flexbox.
43 changes: 22 additions & 21 deletions src/v2/guide/installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ Vue أيضاً متوفرة على [unpkg](https://unpkg.com/vue@{{vue_version}}

## NPM ( مدير حزم Node.js )

NPM هي الأداة الموصى بإصتخدامها عند بناء تطبيقات كبيرة الحجم بإستخدام Vue. فهي تعمل جيداً مع أدوات التجميع مثل [Webpack](https://webpack.js.org/) و [Browserify](http://browserify.org/). Vue أيضاً توفر أدوات خاصة بالإصدار مثل [Single File Components](single-file-components.html).
NPM هي الأداة الموصى بإصتخدامها عند بناء تطبيقات كبيرة الحجم بإستخدام Vue. فهي تعمل جيداً مع أدوات التجميع مثل [backpack](https://webpack.js.org/) و [Browserify](http://browserify.org/). Vue أيضاً توفر أدوات خاصة بالإصدار مثل [Single File Components](single-file-components.html).
6km marked this conversation as resolved.
Show resolved Hide resolved
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
NPM هي الأداة الموصى بإصتخدامها عند بناء تطبيقات كبيرة الحجم بإستخدام Vue. فهي تعمل جيداً مع أدوات التجميع مثل [backpack](https://webpack.js.org/) و [Browserify](http://browserify.org/). Vue أيضاً توفر أدوات خاصة بالإصدار مثل [Single File Components](single-file-components.html).
NPM هي الأداة الموصى بإصتخدامها عند بناء تطبيقات كبيرة الحجم بإستخدام Vue. فهي تعمل جيداً مع أدوات التجميع مثل [Wackpack](https://webpack.js.org/) و [Browserify](http://browserify.org/). Vue أيضاً توفر أدوات خاصة بالإصدار مثل [Single File Components](single-file-components.html).


``` bash
# latest stable
Expand Down Expand Up @@ -89,9 +89,9 @@ Vue توفر [أدوات سطر الأوامر الرسمية](https://github.co

### مصطلحات

- **الكامل**: الإصدارات التي تحتوي على كلِ من المترجم وبيئة العمل.
- **الكامل**: الإصدارات التي تحتوي على كلِ من المفسر وبيئة العمل.

- **المترجم**: الكود المسئول عن ترجمة قوالب الكلمات لدوال Javascript الخاصة الخاصة بالتصدير.
- **المفسر**: الكود المسئول عن ترجمة قوالب الكلمات لدوال Javascript الخاصة الخاصة بالتصدير.

- **Runtime**: code that is responsible for creating Vue instances, rendering and patching virtual DOM, etc. Basically everything minus the compiler.

Expand All @@ -105,27 +105,27 @@ Vue توفر [أدوات سطر الأوامر الرسمية](https://github.co

- ESM for browsers (2.6+ only): intended for direct imports in modern browsers via `<script type="module">`.

### Runtime + Compiler vs. Runtime-only
### وقت التشغيل + المفسر vs. وقت التشغيل فقط

If you need to compile templates on the client (e.g. passing a string to the `template` option, or mounting to an element using its in-DOM HTML as the template), you will need the compiler and thus the full build:
إذا أحتجت ترجمة القوالب في جهة العميل، سوف تحتاج المفسر و البناء الكامل.

``` js
// this requires the compiler
// هذا يتطلب المفسر
new Vue({
template: '<div>{{ hi }}</div>'
})

// this does not
// هذا لا يتطلب المفسر
new Vue({
render (h) {
return h('div', this.hi)
}
})
```

When using `vue-loader` or `vueify`, templates inside `*.vue` files are pre-compiled into JavaScript at build time. You don't really need the compiler in the final bundle, and can therefore use the runtime-only build.
عند إستخدام `vue-loader` أو `vueify`, القوالب بداخل ملفات `*.vue` تكون مترجمة من قبل داخل JavaScript في وقت البناء. أنت لا تحتاج المفسر في الحزمة النهائية,و ,و بالتالي يمكنك إستخدام بناء وقت-التشغيل فقط.

Since the runtime-only builds are roughly 30% lighter-weight than their full-build counterparts, you should use it whenever you can. If you still wish to use the full build instead, you need to configure an alias in your bundler:
نظرًا لأن إصدارات وقت التشغيل فقط أقل مساحة بنسبة 30 ٪ تقريبًا من نظيراتها كاملة الإنشاء ، فيجب عليك استخدامها كلما استطعت. إذا كنت لا تزال ترغب في استخدام الإصدار الكامل بدلاً من ذلك ، فأنت بحاجة إلى تكوين اسم مستعار في الحزمة الخاصة بك:

#### Webpack

Expand Down Expand Up @@ -157,7 +157,7 @@ rollup({

#### Browserify

Add to your project's `package.json`:
أضف ملف `package.json` الخاص بمشروعك :
6km marked this conversation as resolved.
Show resolved Hide resolved

``` js
{
Expand All @@ -170,7 +170,7 @@ Add to your project's `package.json`:

#### Parcel

Add to your project's `package.json`:
أضف ملف `package.json` الخاص بمشروعك :
Aissaoui-Ahmed marked this conversation as resolved.
Show resolved Hide resolved

``` js
{
Expand All @@ -181,25 +181,26 @@ Add to your project's `package.json`:
}
```

### Development vs. Production Mode
### وضع التطوير / وضع الإنتاج

Development/production modes are hard-coded for the UMD builds: the un-minified files are for development, and the minified files are for production.
أوضاع التطوير/الإنتاج ثابتة في إنشاءات UMD: الملفات غير المصغرة للتطوير ، والملفات المصغرة للإنتاج.

CommonJS and ES Module builds are intended for bundlers, therefore we don't provide minified versions for them. You will be responsible for minifying the final bundle yourself.
وحدات CommonJS و ES Module مخصصة للحزم ، لذلك لا نقدم إصدارات مصغرة لها. ستكون مسؤولاً عن تصغير الحزمة النهائية بنفسك.

CommonJS and ES Module builds also preserve raw checks for `process.env.NODE_ENV` to determine the mode they should run in. You should use appropriate bundler configurations to replace these environment variables in order to control which mode Vue will run in. Replacing `process.env.NODE_ENV` with string literals also allows minifiers like UglifyJS to completely drop the development-only code blocks, reducing final file size.
تحافظ إصدارات CommonJS و ES Module أيضًا على عمليات التحقق الأولية لـ `process.env.NODE_ENV` لتحديد الوضع الذي يجب أن تعمل فيه. يجب استخدام حزم المفسر المناسبة لاستبدال متغيرات البيئة هذه للتحكم في الوضع الذي سيتم تشغيل Vue فيه. تسمح عملية process.env.NODE_ENV` التي تحتوي على نصوص حرفية أيضًا للمُصغرات مثل UglifyJS بإسقاط كتل التعليمات البرمجية للتطوير فقط ، مما يقلل من حجم الملف النهائي.

#### Webpack

In Webpack 4+, you can use the `mode` option:
في حزمة الويب 4+, يمكنك إستخدام إختيار ال `mode`:

``` js
module.exports = {
mode: 'production'
}
```

But in Webpack 3 and earlier, you'll need to use [DefinePlugin](https://webpack.js.org/plugins/define-plugin/):
و لكن في حزمة الويب 3 أو أقل, ستحتاج إلى استخدام [DefinePlugin](https://webpack.js.org/plugins/define-plugin/):

``` js
var webpack = require('webpack')
Expand All @@ -219,7 +220,7 @@ module.exports = {

#### Rollup

Use [rollup-plugin-replace](https://github.com/rollup/rollup-plugin-replace):
إستخدم [rollup-plugin-replace](https://github.com/rollup/rollup-plugin-replace):

``` js
const replace = require('rollup-plugin-replace')
Expand All @@ -236,19 +237,19 @@ rollup({

#### Browserify

Apply a global [envify](https://github.com/hughsk/envify) transform to your bundle.
قم بتقديم تحويل [envify](https://github.com/hughsk/envify) عالمي إلى حزمتك.
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

عالمي؟ المصطلح هنا غير مناسب تماما. يمكنك ان تعرف ان كلمة
global
تعني انه متوفر في اي مكان من النظام وليس فقط في المجلد الحالي. بمعرفتك لهذه المعلومة يمكنك ايجاد مصطلح اكثر تناسبا من "عالمي" لوضعه هنا

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

أظن أن مصطلح "عام" مناسب في هذا السياق.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"حول حزمتك على مستوى النظام بأكمله"
هذه الترجمة الاقرب في رأيي لكامل الجملة


``` bash
NODE_ENV=production browserify -g envify -e main.js | uglifyjs -c -m > build.js
```

Also see [Production Deployment Tips](deployment.html).
إطلع أيضاً على [Production Deployment Tips](deployment.html).

### CSP environments

Some environments, such as Google Chrome Apps, enforce Content Security Policy (CSP), which prohibits the use of `new Function()` for evaluating expressions. The full build depends on this feature to compile templates, so is unusable in these environments.
تفرض بعض البيئات ، مثل Google Chrome تطبيقات ، سياسة أمان المحتوى (CSP) ، والتي تحظر استخدام `` الوظيفة الجديدة () '' لتقييم التعبيرات. يعتمد البناء الكامل على هذه الميزة لتجميع القوالب ، لذا فهو غير قابل للاستخدام في هذه البيئات.

On the other hand, the runtime-only build is fully CSP-compliant. When using the runtime-only build with [Webpack + vue-loader](https://github.com/vuejs-templates/webpack-simple) or [Browserify + vueify](https://github.com/vuejs-templates/browserify-simple), your templates will be precompiled into `render` functions which work perfectly in CSP environments.
من ناحية أخرى ، فإن بناء وقت التشغيل فقط متوافق تمامًا مع CSP. عند استخدام إصدار وقت التشغيل فقط مع [Webpack + vue-loader] (https://github.com/vuejs-templates/webpack-simple) أو [Browserify + vueify] (https://github.com/vuejs-templates / browserify-simple) ، سيتم تجميع القوالب الخاصة بك مسبقًا في وظائف "تقديم" التي تعمل بشكل مثالي في بيئات CSP.

## إصدار التطوير

Expand Down