Skip to content

Commit 2831263

Browse files
committed
Update the readme
1 parent b1d8f43 commit 2831263

File tree

1 file changed

+2
-99
lines changed

1 file changed

+2
-99
lines changed

README.md

Lines changed: 2 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# Django Vite Vue
22

3+
[![pub package](https://img.shields.io/pypi/v/django-vitevue)](https://pypi.org/project/django-vitevue/)
4+
35
Manage Vitejs frontends and compile them to Django static files and templates. Some management
46
commands are available:
57

@@ -268,105 +270,6 @@ export default class Market {
268270

269271
## Example
270272

271-
### Backend
272-
273-
Create a project directory and initialize a Django project with *static* and *templates* folders:
274-
275-
```
276-
pip install django django-vitevue
277-
mkdir my_project
278-
cd my_project
279-
django-admin createproject my_project
280-
cd my_project
281-
mkdir templates static
282-
cd ..
283-
```
284-
285-
Add `"vv",` to `INSTALLED_APPS`
286-
287-
Configure the basic settings:
288-
289-
```python
290-
TEMPLATES = [
291-
{
292-
"BACKEND": "django.template.backends.django.DjangoTemplates",
293-
"DIRS": [BASE_DIR / "templates"],
294-
# ...
295-
},
296-
]
297-
298-
STATICFILES_DIRS = [
299-
BASE_DIR / "static",
300-
]
301-
302-
STATIC_URL = "/static/"
303-
```
304-
305-
Add an url to view the index template:
306-
307-
```python
308-
from django.urls import path
309-
from django.views.generic import TemplateView
310-
311-
urlpatterns = [
312-
# ...
313-
path("", TemplateView.as_view(template_name="index.html")),
314-
]
315-
```
316-
317-
### Frontend
318-
319-
Initialize a Vue 3 Typescript frontend:
320-
321-
```
322-
yarn create vite frontend --template=vue-ts
323-
cd frontend
324-
yarn install
325-
cd ..
326-
```
327-
328-
### Run
329-
330-
Run the migrations:
331-
332-
```
333-
python my_project/manage.py migrate
334-
```
335-
336-
Generate the frontend config. Dry run:
337-
338-
```
339-
python my_project/manage.py viteconf
340-
```
341-
342-
Install the frontend dev dependencies as indicated in the command output message:
343-
344-
```
345-
cd frontend
346-
yarn add -D move-file-cli del-cli npm-run-all
347-
cd ..
348-
```
349-
350-
Then write the config to *vite.config.ts* and *package.json*:
351-
352-
```
353-
python my_project/manage.py viteconf -w
354-
```
355-
356-
Build the frontend:
357-
358-
```
359-
cd frontend
360-
yarn build
361-
cd ..
362-
```
363-
364-
Run the server:
365-
366-
```
367-
python my_project/manage.py runserver
368-
```
369-
370273
Example repository: https://github.com/synw/django-vitevue-example
371274

372275
## Run the tests

0 commit comments

Comments
 (0)