Write Nuxt.js Apps in Python
- Write Nuxt.js applications using Python!
- Currently only supports custom Javascripthon but in the future other compilers will also be expected to work.
- 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 master branch e.g:
pip install -e git+https://gitlab.com/metapensiero/metapensiero.pj#egg=javascripthon
-
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.
TIP If you use Vim you can get the full experience with posva/vim-vue#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>
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>
👉 For a working example, see here.
- Clone this repository
- Install dependencies using
yarn install
ornpm install
- Start development server using
npm run dev
Copyright (c) Sebastian Silva [email protected]
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.