基于grunt的工作流的Flask项目结构

Question

我最近购买了一个基于Bootstrap框架的HTML / CSS / Js管理模板。它基本上涵盖了我对MVP的所有需求，我的计划是稍微定制它，然后将已经开发的后端插入烧瓶。

我在这个领域缺乏经验，所以我对这个管理模板使用的自动工作流程印象深刻。 基本结构如下：

root/
├── dist/
│   └── html/
│       ├── assets/
│       └── all_pages.html
├── grunt/
│   └── tasks/
├── node_modules/
├── src/
│   ├── assets/
│   ├── html/
│   ├── js/
│   └── sass/
├── Gruntfile.js
└── package.json

感谢grunt任务和npm管理，处理资产非常简单，在安装npm之后，您可以使用grunt处理所有内容。

sass以css样式编译以进行制作，所有代码都会缩小并复制到dist文件夹，具体取决于设置。

您可以在src路径上轻松开发，并使用grunt任务＆＃34; server＆＃34;在将所有内容发送到生产文件夹＆＃34; dist＆＃34;。

之前，要同时注意更改并直接显示它们

当我试图通过与之交互的烧瓶应用程序来保持这种行为时，我的问题就出现了。

我的烧瓶应用使用了这种结构：

root/
├── __init__.py
├── templates/
│   ├── layout.html
│   └── bp1/
│   │   ├── layout.html
│   │   └── other_pages.html
│   └── bp2/
│       ├── layout.html
│       └── other_pages.html
├── views/
│   ├── __init__.py
│   ├── bp1.py.py
│   └── bp2.py.py
├── static/
│   ├── css/
│   ├── js/
│   └── img/
├── Dockerfile
└── requirements.txt

基本上，开发版和生产版之间没有区别，Web应用程序通过其docker镜像进行部署。

我的问题是，我该如何处理这两个家伙的合并？如何使用src-dist分离的烧瓶项目和类似于我上面描述的工作流程？

我想保留管理模板的所有优点（我设法注意到我的技能），并且有以下内容：

• src和dist文件夹分离...所有sass项目，未使用/丢弃的js代码和html页面仅在开发中＃s; src＆＃34;文件夹，不会在生产中使用
• grunt自动化，用于编译sass，清理lib目录，查看更改，npmcopy（使用npm安装包并仅将所需文件移至生产中），通知，缩小等...
• 基于Docker镜像的部署，仅基于＆＃34; dist-generated＆＃34;资源并忽略了＆＃34; src-development＆＃34;东西。

Answer 1

好吧，我想出了一个非常整洁的设置，我觉得值得分享给其他在类似场景中遇到困难或疑惑的人。

结构

root/
├── src/
│   ├── __init__.py
│   ├── models.py
│   ├── database.py
│   ├── static/
│   │   ├── css/
│   │   │   └── app.css
│   │   ├── js/
│   │   ├── img
│   │   └── lib
│   ├── templates/
│   │   ├── layout.html
│   │   ├── bp1/
│   │   │   ├── layout.html
│   │   │   └── other_pages.html
│   │   └── bp2/
│   │       ├── layout.html
│   │       └── other_pages.html
│   ├── views/
│   │   ├── __init__.py
│   │   ├── bp1.py
│   │   └── bp2.py
│   └── sass/
├── dist/
│   ├── __init__.py
│   ├── models.py
│   ├── database.py
│   ├── static/
│   │   ├── css/
│   │   │   └── app.css
│   │   ├── js/
│   │   ├── img
│   │   └── lib
│   ├── templates/
│   │   ├── layout.html
│   │   ├── bp1/
│   │   │   ├── layout.html
│   │   │   └── other_pages.html
│   │   └── bp2/
│   │       ├── layout.html
│   │       └── other_pages.html
│   └── views/
│       ├── __init__.py
│       ├── bp1.py
│       └── bp2.py
├── templates/
│   ├── layout.html
│   └── bp1/
│   │   ├── layout.html
│   │   └── other_pages.html
│   └── bp2/
│       ├── layout.html
│       └── other_pages.html
├── views/
│   ├── __init__.py
│   ├── bp1.py.py
│   └── bp2.py.py
├── static/
│   ├── css/
│   ├── js/
│   └── img/
├── instance/
│   └── flask.cfg
├── grunt/
│   └── tasks/
├── static/
├── node_modules/
├── venv/
├── Gruntfile.js
├── package.json
├── Dockerfile
├── .gitignore
└── requirements.txt

工作流

• 使用npm安装软件包，并生成package.json（生成node_modules）。
• 使用＆＃39; requirements.txt＆＃39;配置python virtualenv。并链接到＆＃39; venv＆＃39;。
• 调用grunt任务并使用npmcopy仅将所需文件移动到烧瓶使用的src/static/lib。模板为：static/lib以保持src-dist兼容性。
• 一个笨拙的任务能够编译sass部分并创建＆＃39; app.css＆＃39;在static/css内。
• 其他几个grunt任务做其他有用的事情，如缩小。
• grunt的默认任务同时执行“观看”任务＆＃39;并启动flask run以使开发顺利进行（稍后将详细介绍）。
• grunt dist在dist文件夹中创建一个生产就绪的烧瓶项目，其中包含前面步骤中开发的所有包，样式和页面。

Grunt的烧瓶任务

这段简单的代码设法在本地启动烧瓶服务器以开始开发。

// Launch flask's server
grunt.registerTask('flask', 'Run flask server.', function() {
  var spawn = require('child_process').spawn;
  grunt.log.writeln('Starting Flask.');
  var PIPE = {
    stdio: 'inherit',
    env: {
      FLASK_APP: './src/__init__.py:create_app()',
      FLASK_ENV: 'development',
      LC_ALL: 'C.UTF-8',
      LANG: 'C.UTF-8'
    }
  };
  // more on venv later
  spawn('venv/bin/flask', ['run'], PIPE);
});

用于开发的Flask设置

为了使flask run命令在开发模式下正常工作，配置如下：

• venv ：用于项目的python virtualenv的符号链接。
• instance / flask.cfg ：flask实例文件夹

Gitignore

除了整个＆＃39; dist＆＃39;文件夹，这些从VCS中排除：

• VENV;
• 实例文件夹;
• src one中的lib文件夹;
• node_modules;

结论

这个设置非常方便，很容易分享。本地，简单，配置使一切工作整洁，适合开发。 可以生成生产代码，然后根据策略（k8s，服务器部署，......）快速部署/配置。