Как настроить фронтенд-конвейер, встроенный в приложение Django

Я следую руководству онлайн, но у меня возникла проблема с встраиванием моего front-end pipeline в мое приложение Django.

Шаги, которые я предпринял, были...

  1. create a folder (I called it test-project)
  2. create virtual environment python -m venv venv
  3. Installed Django while in my virtual environment
  4. started Django Project django-admin startproject myapp
  5. inside /test-project/myapp/ create folders assets, static, templates
  6. inside /test-project/myapp/ ran in command line npm init -y
  7. inside /test-project/myapp/ ran in command line yarn add webpack webpack-cli --save-dev
  8. inside /test-project/myapp/assets/ created file index.js and added the following code
    function component() {
      const element = document.createElement('div');
      element.innerHTML = 'Hello webpack';
      return element;
    }
    document.body.appendChild(component());
    
  9. created in /test-project/myapp/ file webpack.config.js and added the following
    const path = require('path');
    
    module.exports = {
      entry: './assets/index.js',  // path to our input file
      output: {
        filename: 'index-bundle.js',  // output bundle file name
        path: path.resolve(__dirname, './static'),
      },
    };
    
  10. added to package.json file in /test-project/myapp/ to the "scripts" key
    "dev": "webpack --mode development --watch"
    
  11. Ran yarn run dev and /test-project/myapp/static/index-bundle.js file got created
  12. in /test-project/myapp/templates/ created file hello_webpack.html and added the following
{% load static %}
<!doctype html>
<html>
  <head>
    <title>Getting Started with Django and Webpack</title>
  </head>
  <body>
    <script src="{% static 'index-bundle.js' %}"></script>
  </body>
</html>
  1. added to /test-project/myapp/myapp/urls.py the following
from django.views.generic.base import TemplateView

urlpatterns = [
  # other patterns here
  path('hello-webpack/', TemplateView.as_view(template_name='hello_webpack.html'))
]
  1. added to /test-project/myapp/myapp/settings.py the following
import os

STATICFILES_DIRS = [
  os.path.join(BASE_DIR, 'static'),
]
  1. added to INSTALLED_APPS in /test-project/myapp/myapp/settings.py myapp
  2. ran python manage.py runserver and went to the following url
http://localhost:8000/hello-webpack/

Проблема в том, что он говорит, что шаблона представления не существует. Теперь я сделал все в точности, как написано в шагах, ничего больше / ничего меньше. Не уверен, что у меня неправильная структура папок или что. Пытаюсь понять, что не так с моей установкой и почему, чтобы я мог продолжить работу с остальным руководством на этом сайте.

Вернуться на верх