是否可以将 Webpack/VueJS 与 Odoo 框架(v12)集成?

Posted

技术标签:

【中文标题】是否可以将 Webpack/VueJS 与 Odoo 框架(v12)集成?【英文标题】:Is it possible to integrate Webpack/VueJS with the Odoo Framework (v12)? 【发布时间】:2019-06-11 08:46:39 【问题描述】:

我想通过 WebPack 将 VueJS 集成到我的一个自定义 Odoo 模块中,并在我启动 Odoo-bin 时让它自动启动。

有人有解决办法吗? 甚至可能吗?

我知道你可以将 VueJS 作为一个简单的 .JS 文件包含在模块的模板中,但这意味着我不能使用 WebPack 支持的 .vue 组件。

我还了解到 Odoo 有自己的 JS 框架,但我找不到很好的教程/文档。

编辑:对于任何可能想知道我是如何解决这个问题的人,这就是我所做的:

我使用npm init 在我的 Odoo 文件夹的根目录中初始化了一个 package.json 文件。我在包中添加了一个启动脚本,用于启动 webpack 并将所有 vue 组件捆绑在 myAddons 文件夹(我存储自定义模块的位置)中,然后通过 python odoo-bin ... 命令启动 Odoo。剩下的就是使用npm start 来启动它。

这样,vue 组件被捆绑到单个 JS 文件中,然后我将其添加到我的模块的模板中。这有点不方便,因为必须手动完成第一个包才能知道需要将哪些 JS 文件导入模板。此外,我仍在尝试弄清楚如何分别捆绑每个模块的组件。一旦我找到合适的方法,就会更新它。 ...希望。

【问题讨论】:

在github上分享源码,你可能会找到一些贡献者。 【参考方案1】:

默认情况下,odoo 前端部分主要基于backbone, jquery, underscore。如果要使用任何其他 JS 库,则必须确保它们之间的兼容性。 JS功能的odoo后端部分写在web模块下,可以在odoo社区代码的odoo/addons/web/static/src/js目录中找到。电子商务/网站部分位于website* 模块下。

【讨论】:

我浏览了 web 模块。我不会说我全部理解,但我有点明白它是如何工作的。请允许我问一个问题:假设我想以一种允许它在 Odoo 本身启动时启动的方式添加 webpack,以便它可以将 vue 组件编译为 javascript 文件并将它们合并到启动脚本中。这甚至可能,还是我要求太多?谢谢! 如果您对 js 进行了足够的修改,并且与现有的 odoo js 架构配合得很好,您可以从 init 脚本 systemd 调用构建过程(npm 或 vue-cli 或任何东西) daemon,或来自odoo-bin 脚​​本,这是一个纯python 脚本,因此您可以使用python subprocess 模块进行任何系统调用。 啊,这正是我想要的。我只需要在 odoo 服务器实际加载之前让 webpack 捆绑我的 vue 组件。不过,我在哪里可以找到初始化脚本和/或系统守护进程?抱歉,但我对这个 Odoo 业务还很陌生,而且我真的无法通过源代码中散布的无数文件和脚本找到自己的方法。另外,我将如何在 odoo-bin 中插入自定义脚本?所有文件都有四行代码,我不太确定我是否理解...... systemd daemon/init 脚本实际上取决于您准备 odoo 服务器的方式。以及您需要在 odoo 服务器启动时执行哪些操作/命令。 odoo-bin 只是调用 odoo.cli.main 函数,你可以使用 python subprocess 模块在此之前运行任何命令,或者更好的是,只需结合不同的脚本与 odoo-bin 一起启动。 啊,我明白了。我想我找到了一种方法来做到这一点。我基本上使用 npm 在我的 Odoo 文件夹的根目录中初始化一个 package.json 文件,然后在启动 odoo-bin 之前,我在 package.json 中添加了一个启动脚本,该脚本具有 webpack 捆绑所需的 vue 组件。剩下要做的就是使用 npm start 启动脚本。无论如何,非常感谢您的宝贵支持。你帮了大忙!【参考方案2】:

除了 Odoo JS API 文档基本上不存在(截至我发布此文档时)这一事实之外。我还要补充一点,与调用 Odoo 相比,它就像使用移动目标一样直接使用 JSON-RPC API,因为他们的 JSON-RPC API 在不同版本的 Odoo 中变化很小。

此外,使用 Axios 进行 JSON-RPC API 调用非常简单。因此,只需从您的 Vue 项目中直接访问服务器的 JSON-RPC API。

这就是我在odooinvue.org 所做的事情,它基本上是一个在后端使用 Odoo 的 Vue 项目。该项目专为尝试在后端使用 Odoo 但遇到困难的 Vue 开发人员提供资源,因为他们是 Odoo 开发的新手。

【讨论】:

【参考方案3】:

我建议尝试@StartupGuy 的 odooinvue,它真的很棒。 他们使用 Odoo 14 创建了一个新的现代前端框架:Owl framework。

我自己没试过。

【讨论】:

以上是关于是否可以将 Webpack/VueJS 与 Odoo 框架(v12)集成?的主要内容,如果未能解决你的问题,请参考以下文章

当半年不碰的webpack + vuejs项目重见天日时遇到的神坑!

python 使用aiohttp通过https://justanr.github.io/getting-start-with-aiohttpweb-a-todo-tutorial与Postgres进行

如何在 WEBPACK + VUEJS 中减小包大小

使用 Vuejs、Webpack 和 tailwindcss 创建一个 Electron 应用程序

黄聪:不使用 webpack,vuejs 异步加载模板

我在vue.js命令中初始化webpack时就乱码了,麻烦哪位大神帮我看看,谢谢了