flask not launching about vue.py

[stefanhoelzl]

Great! As far as I understand all your issues are resolved?
I will close this ticket, feel free to re-open or create a new issue if other problems occur.

Regarding the 404 error, a bit more explanation:
Lets say this is our project structure:

package
|-__init__.py
|-sub.py

when you do a import package with brython, it cannot know in advance if package is a directory or a file, so it tries to access package.py if it gets a 404, so it next tries to access package/__init__.py which succeeds.

Lets look at the vuepy project structure

vue
|-bridge
   |- <multiple .py files>
|-decorators
   |- <multiple .py files>

You get the 404 errors when brython tries to load a module which is a directory (vue, bridge, decorators)

So nothing to worry about the 404, it is part of how brython works.

[stefanhoelzl]

An already installed npm should not have any effect.

What browser and version are you using?
Can you open the developer tools of your browser and check if there are any errors/warnings?

[aaronchn]

OS：windows

pip list
Package Version
brython 3.8.9
click 7.1.2
Flask 1.1.4
itsdangerous 1.1.0
Jinja2 2.11.3
MarkupSafe 2.0.1
pip 22.0.4
PyYAML 5.4.1
setuptools 39.0.1
vuepy 0.3.0
Werkzeug 1.0.1

MarkupSafe must be downgrade to run > vue-cli

See here

[aaronchn]

Finally, the 'First Application' shown in the project documentation looks like it's ready to run.

OS: linux
Browser: Microsoft Edge Version 99.0.1150.38 (64-bit)
Dependencies：

Hi @stefanhoelzl
Now there are two confusions.

1：I still see some errors in the developer tools, do these errors need attention? (I'm concerned that these errors may signal that the current release is not in a state to be used out of the box)

2：In the demo that comes with the project, flask is listening at 127.0.0.1:5000, I would like to listen at another address and port, how should I do that? (For example, I wish to bind flask to local lan address so that mobile phone in the same lan can access the web)

By the way, this project is very valuable for users who are familiar with python and want to do small scale web development, this project also shows the value of Brython. At the same time, the 300+ commits have laid the foundation for a project that is expected to grow robustly and should not be abandoned by the author or anyone capable of submitting a PR.

Thank you！

[stefanhoelzl]

Hi @aaronchn,

Thanks for digging into the MarkupSafe x Flask issue.

Please check out the current master branch

$ pip install "git+https://github.com/stefanhoelzl/vue.py@master#egg=vuepy[flask]"

The dependency versions are upgraded, so flask~=2 is also allowed. As stated in the link you provided, this should also fix the launch issue.

2：In the demo that comes with the project, flask is listening at 127.0.0.1:5000, I would like to listen at another address and port, how should I do that? (For example, I wish to bind flask to local lan address so that mobile phone in the same lan can access the web)

this is also addressed with the latest changes in master. Checkout the documentation, it describes how to set Flask Builtin Configuration Values from vuepy.yml. The value SERVER_NAME allows to change the listen address and port.

1：I still see some errors in the developer tools, do these errors need attention? (I'm concerned that these errors may signal that the current release is not in a state to be used out of the box)

Unfortunately this can't be fixed by vuepy, it is caused by brython and how the import mechanism im python works.
The python import mechanism iterates through sys.path and for each entry it tries to find the module to import there.
But with Brython for each entry where it does not find the module you see such an 404 error, because it tries to load the file but cannot find it.

[aaronchn]

Hi @stefanhoelzl
Thank you so much for your response and update!

I followed your guide and tried it with master, but it looks like there is a little problem. I hope the cause of this problem is not caused by pipenv's environment.

[stefanhoelzl]

I see, this is because the setup.py does not handle all packaging tasks.

I am working on providing wheels for the current master commit, but this may take some time.

In the mean time you can try the following workaround:

git clone https://github.com/stefanhoelzl/vue.py.git
cd vue.py
make env.vuejs env.vuex env.vue-router
cd <your-project>
pipenv install <path-to-vuepy>

[stefanhoelzl]

In the meantime I made some changes to the build/CI system.

this works now

$ pip install "git+https://github.com/stefanhoelzl/vue.py@master#egg=vuepy[flask]"

you can also download a wheel built from current master here
https://github.com/stefanhoelzl/vue.py/releases

[aaronchn]

Hi @stefanhoelzl

Thank you so much for your update!

1: Successfully installed master to the virtual environment with
$ pipenv install "git+https://github.com/stefanhoelzl/vue.py@master#egg=vuepy[flask]"
btw, the "Installing dependencies from Pipfile.lock" step takes a long time, about 5 minutes.

2: The SERVER_NAME configuration in vuepy.yml is valid and I can specify the flask binding settings with this option. Now, I can access the service on my phone on the same lan.
btw, no difference in response to vuepy between pc browser and mobile browser is found for now.

3: Accessing 'First Application' on a pc browser still results in some 404, and although I don't quite understand your previous explanation, I guess this should not be a significant risk for my further attempts at this project.

[aaronchn]

Hi @stefanhoelzl

Sorry to interrupt again

When I write a fixed address of 10.0.0.155 for a lan to vuepy.yml, Flask works fine.

When I try to use 0.0.0.0 as the address to wait for a request, flask seems to be able to interpret 0.0.0.0 as the current address 10.0.0.155 for that pc. However, an error is encountered when trying to request it.

[stefanhoelzl]

my bad, SERVER_NAME is the wrong setting.

re-install vuepy from GitHub, to get the latest changes

pip uninstall vuepy
pip install "git+https://github.com/stefanhoelzl/vue.py@master#egg=vuepy[flask]"

and try this vuepy.yml

provider:
  flask:
    HOST: "0.0.0.0"
    PORT: 5001

[aaronchn]

After configuring vuepy.yml in the new format and reinstalling master, the results are as follows.

I think this is probably normal and does not need to be noticed.

So far all my problems have been solved perfectly.

Thx.
Have a good day!

[bobwatcherx]

i get errror when running project
root@mino-HP-Convertible-x360-11-ab1XX:/home/mino/belajar/vuepy# vue-cli deploy flask
Traceback (most recent call last):
File "/usr/local/bin/vue-cli", line 5, in
from vuecli.cli import main
File "/usr/local/lib/python3.10/dist-packages/vuecli/cli.py", line 6, in
from vuecli.provider import RegisteredProvider
File "/usr/local/lib/python3.10/dist-packages/vuecli/provider/init.py", line 11, in
RegisteredProvider = {
File "/usr/local/lib/python3.10/dist-packages/vuecli/provider/init.py", line 12, in
entry_point.name: _load(entry_point)
File "/usr/local/lib/python3.10/dist-packages/vuecli/provider/init.py", line 6, in _load
return ep.load()
File "/usr/lib/python3/dist-packages/pkg_resources/init.py", line 2465, in load
return self.resolve()
File "/usr/lib/python3/dist-packages/pkg_resources/init.py", line 2471, in resolve
module = import(self.module_name, fromlist=['name'], level=0)
File "/usr/local/lib/python3.10/dist-packages/vuecli/provider/flask.py", line 4, in
from flask import Flask as FlaskApp, send_file, abort
File "/usr/local/lib/python3.10/dist-packages/flask/init.py", line 4, in
from . import json as json
File "/usr/local/lib/python3.10/dist-packages/flask/json/init.py", line 6, in
from jinja2.utils import htmlsafe_json_dumps as _jinja_htmlsafe_dumps
File "/usr/local/lib/python3.10/dist-packages/jinja2/init.py", line 12, in
from .environment import Environment
File "/usr/local/lib/python3.10/dist-packages/jinja2/environment.py", line 25, in
from .defaults import BLOCK_END_STRING
File "/usr/local/lib/python3.10/dist-packages/jinja2/defaults.py", line 3, in
from .filters import FILTERS as DEFAULT_FILTERS # noqa: F401
File "/usr/local/lib/python3.10/dist-packages/jinja2/filters.py", line 13, in
from markupsafe import soft_unicode
ImportError: cannot import name 'soft_unicode' from 'markupsafe' (/usr/local/lib/python3.10/dist-packages/markupsafe/init.py)

my code
from vue import *

class App(VueComponent):
template = "

Hello vue.py

"
App("#app")