V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐学习书目
Learn Python the Hard Way
Python Sites
PyPI - Python Package Index
http://diveintopython.org/toc/index.html
Pocoo
值得关注的项目
PyPy
Celery
Jinja2
Read the Docs
gevent
pyenv
virtualenv
Stackless Python
Beautiful Soup
结巴中文分词
Green Unicorn
Sentry
Shovel
Pyflakes
pytest
Python 编程
pep8 Checker
Styles
PEP 8
Google Python Style Guide
Code Style from The Hitchhiker's Guide
clino
V2EX  ›  Python

在后端代码(以 uliweb 为例)里嵌入纯前端代码(以 vue 为例)的开发方式

  •  
  •   clino ·
    zhangchunlin · 2018-11-03 13:42:27 +08:00 · 3828 次点击
    这是一个创建于 2214 天前的主题,其中的信息可能已经有所发展或是发生改变。
    我很不喜欢调试的时候后端和前端的调试服务器都开着,因为是两个端口还要搞跨域,所以试试直接在后端代码里嵌入纯前端的应用

    大概做法是
    - 把前端用 webpack 之类 build 出来的文件配置输出到后端能 serve 的 static 目录下
    - 用 nodejs 里的 watch 监控前端源代码变化并 build

    不好的地方:
    - 感觉这种编译会稍慢一些,比前端的调试服务器用增量编译并用 websocket 传到页面慢不少
    - static 文件会有缓存,所以调试的时候要强制刷新( ctrl+shift+r) 或者浏览器里禁用 cache

    比较适合于我们这种本来是后端程序员,但是也想用纯前端开发的伪全栈

    具体例子代码: https://github.com/zhangchunlin/node_in_uliweb_example
    22 条回复    2018-11-05 13:38:55 +08:00
    Trim21
        1
    Trim21  
       2018-11-03 14:35:00 +08:00 via Android
    webpack 有 proxy table 解决跨域问题…
    TomatoFish
        2
    TomatoFish  
       2018-11-03 15:20:15 +08:00
    我配了个 nginx 来转发,主要是头一次配置的时候花些时间
    TabGre
        3
    TabGre  
       2018-11-03 18:20:07 +08:00 via iPhone
    我是前端,我会花 2 分钟配置 Nginx 转发
    carlclone
        4
    carlclone  
       2018-11-03 18:41:23 +08:00
    Laravel 就是这样做的...官方出了一套 mix 把 vue/react 之类的按需整合进去了
    clino
        5
    clino  
    OP
       2018-11-03 19:02:22 +08:00
    @carlclone 是说这个吗? https://laravel.com/docs/5.7/mix
    看到了 watch,感觉像,但是看起来有点复杂不知道为什么
    akatquas
        6
    akatquas  
       2018-11-03 21:53:45 +08:00 via iPhone
    前后端分离的话就要把 proxy 解决掉,不然就用 ssr 来做。

    不过也可以试试 next+egg 的思路
    PythonAnswer
        7
    PythonAnswer  
       2018-11-04 00:14:19 +08:00 via iPhone
    看过好几个这样搞的了,坏处是出来的东西都是一个样,耦合紧
    kran
        8
    kran  
       2018-11-04 00:24:05 +08:00 via iPhone
    看到 uliweb,想起年轻的时候,〒_〒
    FakeLeung
        9
    FakeLeung  
       2018-11-04 00:58:00 +08:00 via Android
    webpack 的 devserver 中的 proxy 了解一下?
    FrankFang128
        10
    FrankFang128  
       2018-11-04 01:07:15 +08:00
    你看 Rails 开发者就不用关心这些无聊的配置,rails server + bin/webpack-dev-server 运行一下就开干。
    yuanfnadi
        11
    yuanfnadi  
       2018-11-04 08:47:49 +08:00 via iPhone
    突然发现我好像写过这样的项目,vue build 完成以后拷贝到 springboot 的静态目录。
    clino
        12
    clino  
    OP
       2018-11-04 09:45:19 +08:00 via Android
    @akatquas 我这是另一个选择,不用折腾 proxy
    你说的 ssr next egg 都不了解,有空了解下
    clino
        13
    clino  
    OP
       2018-11-04 09:50:48 +08:00 via Android
    @PythonAnswer 为什么这样就会耦合紧?这只是调试部署上的调整,和具体开发关系不大
    lancelock
        14
    lancelock  
       2018-11-04 11:51:41 +08:00 via iPhone
    我也在研究这问题,感觉还是开发的时候分开,部署的时候打包到 static 里好,因为每次 static 更新都要重新编译。webpack 是有 proxy,但我用的 parcel。有没有用 parcel 的大佬说说怎么配代理吗
    Sparetire
        15
    Sparetire  
       2018-11-04 12:58:20 +08:00 via Android
    搞跨域不就是一个 CORS 的事情吗。。就算不用 webpack 的 proxy,自己手撸一个简单的代理或者带 CORS 的 mock server 做成 cli 放 npm script 里,一次撸完以后每次项目都能用到不是也很方便。。
    clino
        16
    clino  
    OP
       2018-11-04 15:43:25 +08:00
    @lancelock "因为每次 static 更新都要重新编译" 不明白你说的是什么意思,我这里只要 build 输出到 static 目录下就行了
    lancelock
        17
    lancelock  
       2018-11-04 16:49:02 +08:00 via iPhone
    @clino 你是 python 吧?确实动态语言不需要。我是写 java 的,修改代码需要编译一下才能生效,有时候还得重启
    clino
        18
    clino  
    OP
       2018-11-04 21:30:54 +08:00
    @lancelock 这个和静态和动态语言没关系,而是和调试服务器的实现有关系吧,如果调试服务器不提前加载 static 文件列表,而是实时去取文件路径下的文件就不用重启
    clino
        19
    clino  
    OP
       2018-11-04 22:30:03 +08:00
    @Sparetire 调试的时候跨域,但是部署的时候实际上不跨域,这样造成调试和部署的时候不一致,对这个我觉得很不舒服.
    ala2008
        20
    ala2008  
       2018-11-05 09:53:20 +08:00
    ci、cd 很麻烦,试过 build 慢死。。
    clino
        21
    clino  
    OP
       2018-11-05 10:26:14 +08:00
    @ala2008 ci cd 这方面没什么差别吧,都要从头 build
    ala2008
        22
    ala2008  
       2018-11-05 13:38:55 +08:00
    @clino 分开 build
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1985 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 16:18 · PVG 00:18 · LAX 08:18 · JFK 11:18
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.