Can we prevent build from requiring Python?

[kevinob11]

I need to run my vite build process in CI using a simple node docker container, but right now npm run build requires python and bootstrapping the django app. What do you think about adding an optional config var to the vite.config.ts options that prevents it from running python? It looks like it is only really doing that to pull config from settings.py and get the django version. I'm happy to just enter those manually if we can avoid loading python / django.

[cpontvieux-systra]

Here is what I do, for now:

• I use a pre_test_js job that relies on Python
• I store the values that the npm plugin requires:

  # .gitlab-ci.yml pre_test_js job
  pre_test_js:
  ...
  script:
  - 'mkdir -p build/.vite; echo "{}" > build/.vite/manifest.json'
  - 'poetry run ./manage.py django_vite_plugin --action config > django_vite_plugin.config.json'
  - 'poetry run ./manage.py django_vite_plugin --action version > django_vite_plugin.version.json'
  artifacts:
  when: always
  paths:
    - 'django_vite_plugin.config.json'
    - 'django_vite_plugin.version.json'

• Then I inject those artefact for my node job:

  test_js:
  ...
  needs:
  - pre_test_js
  variables:
  PYPATH: "sh"
  before_script:
  - |
    [ -d build ] && rm -rf build; mkdir -p build
    cp hack-manage.sh manage.py
  ...

• hack-manage.sh is a fake django manage.py file that use the cached files:

  #!/bin/sh
  bad_call() {
  echo "This should be called with 'django_vite_plugin --action|--find-static' arguments" >&2
  exit 1
  }
  [ "$1" = "django_vite_plugin" ] || bad_call
  if [ "$2" = "--action" ]; then
  cat "django_vite_plugin.$3.json"
  elif [ "$2" = "--find-static" ]; then
  shift; shift;
  echo '{}' | jq --arg f "$*" '$f|split(" ")'
  else
  bad_call
  fi

• I then hack a bit the vite.config.js for him to launch my fake manage.py file instead of python (using my PYPATH env var):

  
  # extract from vite.config.js
  ...
  import { djangoVitePlugin } from './django-vite-plugin'
  import { env } from 'process'

export default defineConfig({ server: { host: 'localhost', port: 1 * (env.PORT || '8080'), }, plugins: [ vue(), djangoVitePlugin({ pyPath: env.PYPATH || 'python', // hack to skip python in unit test CI. ... }), ], ... })

That works… but frankly it’s a bit complicated and I’m pretty sure my team’s collegues may no follow…

[kevinob11]

Yeah, in the end I just used a separate vite config that didn't rely on their module for the build:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  build: {
    manifest: true,
    outDir: 'app/static/vite',
    rollupOptions: {
      input: [
        'path/file1.tsx',
        'path/file2.tsx',
      ]
    }
  }
})

Then my build is just vite --config [path to config file] and that seems to work fine. I don't love having the file list in multiple places, but I prefer this simpler approach vs the build process relying on python in any way.

[protibimbok]

Yeah, in the end I just used a separate vite config that didn't rely on their module for the build:

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  build: {
    manifest: true,
    outDir: 'app/static/vite',
    rollupOptions: {
      input: [
        'path/file1.tsx',
        'path/file2.tsx',
      ]
    }
  }
})

Then my build is just vite --config [path to config file] and that seems to work fine. I don't love having the file list in multiple places, but I prefer this simpler approach vs the build process relying on python in any way.

This should be the way to go for now. We need python not just to get the plugin version. There are configurations to get from the django project.

Now, whether to give an option to build without requiring the django is a different discussion. We must know how often this problem is encountered. If it is a reasonable percentage, we can start playing with the different ways of implementing it.

Inshallah I'll keep this issue open for a month or two, to see if people are interested.

[cpontvieux-systra]

Using @kevinob11 idea, I came up with this vite.config.js file:

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { djangoVitePlugin } from 'django-vite-plugin'
import { env } from 'process'
[...]

const plugins = env.NO_DJANGO ? [
  vue(),
] : [
  vue(),
  djangoVitePlugin({
    input: [
      'front/main.js',
    ],
  }),
]

export default defineConfig({
  server: {
    host: 'localhost',
    port: 1 * (env.PORT || '8080'),
    proxy,
  },
  plugins,
  [...]
})

So I just have to define NO_DJANGO variable in my CI test and it then does not require any python/django.