Skip to main content

A simple module to extract html/script/style from a vuejs '.vue' file (can minimize/es2015 compliant js) ... just py2 or py3, NO nodejs !

Project description


"Compile" your VUEJS component (*.vue) to standalone html/js/css ... python only (no need of nodejs). BTW it provides a js-minimizer (es2015 compliant code)

It's just an utility to extract HTML(template), SCRIPT and STYLE from a VUE/SFC component (*.vue). It's PURE python (py2 & py3 compatible), no nodejs ! It's fully unitested (100% !)

It won't replace webpack/nodejs/vue-cli, it fills the "Sometimes you have to work with the tools you have, not the ones you want." gap.

Available on pypi

import vbuild

print( sfc.html )
print( sfc.script )
print( )


import vbuild

ll.append( vbuild.VBuild("c1.vue") )
ll.append( vbuild.VBuild("c2.vue") )


print( s.html )
print( s.script )
print( )

By default, VBuild won't minify things. But you can change that by using vbuild.VBuild("mycompo.vue", minify=True), but you'll need to install css-html-js-minify.

You can use sass (using <style lang="scss"></style> or <style lang="sass"></style>) or less (using <style lang="less"></style>) in your styles. But you'll need to install pyscss or lesscpy, depending on your needs.

By the way, the module provide a js-minimizer(transpiler) (to generate ES5 compliant js) (thru on the clojure online service)

js="""async function  mymethod(...a) {
    var f=(...a) => {let b=12}


  • templates are converted to a <script type="text/x-template" id="XXX"></script> (not converted to JS)
  • A Minimal component needs the <template></template> tag only (specs)
  • You can use <style></style> and/or <style scoped></style> (as many as you want)
  • styles are minimized (remove comments and spaces)

Its main purpose is to let you use components (.vue files) in your vuejs app, without a full nodejs stack. It's up to you to create your generator, to extract the things, and create your "index.html" file. It's a 5 lines of python code; example:

import vbuild,glob
r=sum([vbuild.VBuild(i,minify=True) for i in glob.glob("*.vue")+glob.glob("*/*.vue")])
buf=readYourTemplate("index.tpl") # should contains a tag "<!-- HERE -->" that would be substituted
buf=buf.replace("<!-- HERE -->",str(r))

(a real example of rendering vue/sfc components, using vbuild and the marvelous wuy)

Hope it could help ...


  • more utilities
  • and docs !

Project details

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

vbuild-0.4.5.tar.gz (5.1 kB view hashes)

Uploaded Source

Built Distribution

vbuild-0.4.5-py2.py3-none-any.whl (5.3 kB view hashes)

Uploaded Python 2 Python 3

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page