3

I'd like to know how to specify static directory for Django in the following case.

  • I don't use Django template at all (I don't use {% static ... %} in html file).
  • vue-cli generates outputs under dist/, which is not in the scope of Django project, and I don't like to change this.
  • In index.html, bundle.js is loaded by <link href="static/js/bundle.js">
  • Would like to let Django see index.html and all js files under static/js dir.

Directory tree

root
├── vue_proj
│      └── dist
│           ├── index.html <- SPA, and no Django template in this.
│           └── static <- I wouldd like to let Django see this dir!
│                 └── js
│                      └── bundle.js
└── django_proj <- I executed "django-admin startproject project" here.
       └── project <- I executed "django-admin startapp app" here.
             ├── manage.py
             ├── app 
             └── project
                   ├── settings.py <- What should I do here?

So far I could let Django see dist/index.html by setting TEMPLATES parameter to ../vue_proj/dist.
I tried the follows but resulted in failure of loading js files...

STATIC_ROOT = '../vue-proj/dist'
STATIC_URL = '/static/'
2e0byo
  • 5,305
  • 1
  • 6
  • 26
Pythoner
  • 271
  • 2
  • 9

1 Answers1

3

try this

STATICFILES_DIRS = [

    BASE_DIR.parent / "vue-proj/dist/static'",
]

static root is use for production it will collect all your css and js from static folder to static root dir.

STATIC_ROOT = BASE_DIR.parent / "static_cdn"
Ankit Tiwari
  • 4,438
  • 4
  • 14
  • 41
  • Thank you Ankit you saved my life! At the same time, I could find the way to make Vue.js work with Vue router history-mode by refering to https://stackoverflow.com/questions/42864641/handling-single-page-application-url-and-django-url :) – Pythoner Dec 05 '20 at 04:05
  • Hello @Pythoner glad to hear that you got solution. (: – Ankit Tiwari Nov 13 '21 at 11:11