README
@nuxtjs/python
Write Nuxt.js Apps in Python
Features
- Write Nuxt.js applications using Python!
- Currently only supports custom Javascripthon but in the future other compilers will also be expected to work.
Setup
- Add
@nuxtjs/python
dependency using yarn or npm to your project - Add
@nuxtjs/python
tomodules
section ofnuxt.config.js
{
modules: [
// Simple usage
'@nuxtjs/python'
]
}
Install the Javascripthon Python transpiler (for now you'll need the development version e.g.
pip install -r requirements.txt
).Note that Javascripthon requires that you have Python 3.5 (or better).
In Vue files, Mark your script tags like this:
<script lang="py?compiler=pj">
.Please note syntax conversions.
Usage
.vue
files
Using TIP If you use Vim you can get the full experience with https://github.com/posva/vim-vue/pull/97
hello.vue
:
<template>
<div>
Nuxt {{ best_lang }}
</div>
</template>
<script lang="py?compiler=pj">
class Component:
def __init__(self):
self['data'] = lambda: { 'best_lang': 'Python' }
__default__ = Component()
</script>
.py
files for other nuxt files
Using store/index.py
from vuex import Store
def increment(state):
state.counter = state.counter + 1
def createStore():
return Vuex.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>
👉 For a working example, see here.
Development
- Clone this repository
- Install dependencies using
yarn install
ornpm install
- Start development server using
npm run dev
License
Copyright (c) Sebastian Silva sebastian@fuentelibre.org
This module was started from the module-template by Pooya Parsa and relies heavily on python-webpack-loader by Martim Nascimento and Javascripthon by Alberto Berti.