python module

@nuxtjs/python

اكتب تطبيقات nuxt.js في بيثون

ملاحظات الإصدار

سمات

• اكتب تطبيقات Nuxt 2 باستخدام Python!
• حاليًا يدعم JavaScripthon المخصص فقط ، ولكن في المستقبل ، من المتوقع أيضًا أن يعمل المجمعون الآخرون.

جرب المثال

1. استنساخ هذا المستودع وتغيير الدليل فيه
2. تثبيت التبعيات:

    npm install                         # or use yarn
   
   pip install -r requirements.txt
   

3. قم بتشغيل مثال: npm run dev

الإعداد في مشروعك الخاص

• أضف @nuxtjs/python التبعية باستخدام الغزل أو NPM إلى مشروعك
• إضافة @nuxtjs/python إلى قسم modules من nuxt.config.js

   {
    modules : [
      '@nuxtjs/python'
    ] ,
    python : {
      compiler : 'pj'   // default
    }
  }

• في ملفات Vue ، حدد علامات البرنامج النصي مثل هذا: <script lang="py"> .
• يمكنك تمرير خيارات إلى PY-Loader (حاليًا تدعم معلمة compiler )

اختيار Python إلى مترجم JavaScript

برنامج التحويل البرمجي الافتراضي والموصى به هو JavaScripthon ولكن من الممكن استخدام المترجمين الآخرين (انظر أدناه).

• تثبيت transpiler Javascripthon Python. ستحتاج الآن إلى الفرع الرئيسي على سبيل المثال:

   pip install -e git+https://gitlab.com/metapensiero/metapensiero.pj#egg=javascripthon
  

• لاحظ أن JavaScripthon يتطلب أن يكون لديك Python 3.5 (أو أفضل).

• يدعم JavaScripthon تحويل بيانات استيراد Python إلى واردات ES6 كما هو مستخدم في Nuxt. يرجى ملاحظة تحويلات بناء الجملة.

• يمكنك تمرير خيار compiler إلى py-loader باستخدام خيارات الوحدة النمطية أو في قسم python في ملف nuxt.config.js الخاص بك.

• يحتوي Transcrypt على نظام الوحدة النمطية الخاصة به ، لذا من أجل استخدامه ، يمكنك استخدام معيار وحدة CommonJS ( require استيراد و module.exports ) ويجب أن تعمل. انظر مثال py-loader Vuejs.

الاستخدام

باستخدام ملفات .vue

نصيحة إذا كنت تستخدم VIM ، يمكنك الحصول على تمييز بناء الجملة لـ HTML و CSS و Python عن طريق تثبيت البرنامج المساعد VIM-VUE وتطبيق هذا التصحيح.

hello.vue .

 < template >
  < div >
      Nuxt {{ best_lang }}
  </ div >
</ template >

< script lang =" py " >
class Component :
  def __init__ ( self ) :
      self [ ' data '] = lambda: { ' best_lang ': ' Python ' }

__default__ = Component ( )
</ script >

باستخدام ملفات .py لملفات nuxt الأخرى

store/index.py

 from vuex import Store

def increment ( state ):
    state . counter = state . counter + 1

def createStore ():
    return Store (
      state = { 'counter' : 0 },
      mutations = { 'increment' : increment }
    )

__default__ = createStore

pages/counter.vue

 < template >
  < h2 > {{ $store.state.counter }} </ h2 >
  < button @click =" $store.commit('increment') " > +1 </ button >
</ template >

للحصول على مثال عمل ، انظر هنا.

تطوير

• استنساخ هذا المستودع
• تثبيت التبعيات باستخدام yarn install أو npm install
• بدء تشغيل خادم التطوير باستخدام npm run dev

رخصة

رخصة معهد ماساتشوستس للتكنولوجيا

حقوق الطبع والنشر (ج) سيباستيان سيلفا [email protected]

بدأت هذه الوحدة من The Module-Templeate by Pooya Parsa وتعتمد اعتمادًا كبيرًا على Python-Webpack-Loader من قبل Martim Nascimento و Javascripthon بواسطة Alberto Berti.