Skip to content

Commit 307a444

Browse files
pandabearcoderpandabearcoder
committed
Configure webpack loader and js reverse lib
1 parent f7020e0 commit 307a444

File tree

11 files changed

+331
-3
lines changed

11 files changed

+331
-3
lines changed

‎config/settings/base.py‎

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@
1414

1515
# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
1616
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
17+
APP_DIR = os.path.join(os.path.dirname(BASE_DIR), 'pythonph')
18+
PROJECT_DIR = os.path.dirname(BASE_DIR)
19+
FRONTEND_DIR = os.path.join(PROJECT_DIR, 'frontend')
1720

1821

1922
# Quick-start development settings - unsuitable for production
@@ -39,7 +42,9 @@
3942
'django.contrib.staticfiles',
4043
]
4144

42-
THIRD_PARTY_APPS = []
45+
THIRD_PARTY_APPS = [
46+
'django_js_reverse',
47+
]
4348

4449
LOCAL_APPS = []
4550

@@ -124,3 +129,19 @@
124129
# https://docs.djangoproject.com/en/2.0/howto/static-files/
125130

126131
STATIC_URL = '/static/'
132+
STATIC_ROOT = os.path.join(APP_DIR, 'static')
133+
STATICFILES_DIRS = [
134+
os.path.join(APP_DIR, 'assets'),
135+
]
136+
137+
# WEBPACK CONFIGURATION
138+
WEBPACK_LOADER = {
139+
'DEFAULT': {
140+
'CACHE': False,
141+
'BUNDLE_DIR_NAME': 'webpack_bundles/', # must end with slash
142+
'STATS_FILE': os.path.join(FRONTEND_DIR, 'webpack-stats.json'),
143+
'POLL_INTERVAL': 0.1,
144+
'TIMEOUT': None,
145+
'IGNORE': ['.+\.hot-update.js', '.+\.map']
146+
}
147+
}

‎config/urls.py‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,19 @@
55
Examples:
66
Function views
77
1. Add an import: from my_app import views
8-
2. Add a URL to urlpatterns: path('', views.home, name='home')
9-
Class-based views
8+
2. Add a URL to urlpatterns: path('', views.home, name='home') Class-based views
109
1. Add an import: from other_app.views import Home
1110
2. Add a URL to urlpatterns: path('', Home.as_view(), name='home')
1211
Including another URLconf
1312
1. Import the include() function: from django.urls import include, path
1413
2. Add a URL to urlpatterns: path('blog/', include('blog.urls'))
1514
"""
15+
from django_js_reverse.views import urls_js
16+
1617
from django.contrib import admin
1718
from django.urls import path
1819

1920
urlpatterns = [
2021
path('admin/', admin.site.urls),
22+
path('jsreverse/', urls_js, name='js_reverse'),
2123
]

‎frontend/.babelrc‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"presets": [
3+
["env", { "modules": false }],
4+
"stage-3"
5+
]
6+
}

‎frontend/.eslintrc‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
{
2+
"root": true,
3+
"extends": "standard",
4+
"globals": {
5+
"window": true,
6+
"document": true,
7+
"fetch": true,
8+
"Headers": true,
9+
"Request": true,
10+
"FormData": true,
11+
"FileReader": true,
12+
"localStorage": true
13+
},
14+
"env": {
15+
"node": true,
16+
"es6": true,
17+
"amd": true,
18+
"browser": true,
19+
"jquery": false
20+
},
21+
"parserOptions": {
22+
"ecmaFeatures": {
23+
"globalReturn": true,
24+
"generators": false,
25+
"objectLiteralDuplicateProperties": false,
26+
"experimentalObjectRestSpread": true
27+
},
28+
"ecmaVersion": 2017,
29+
"sourceType": "module"
30+
},
31+
"plugins": [
32+
"import",
33+
"html",
34+
],
35+
"settings": {
36+
"import/core-modules": [],
37+
"import/ignore": [
38+
"node_modules",
39+
"\\.(coffee|scss|css|less|hbs|svg|json)$"
40+
]
41+
},
42+
"rules": {
43+
"no-console": 0,
44+
"comma-dangle": 0
45+
}
46+
}

‎frontend/.gitignore‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
.DS_Store
2+
node_modules/
3+
dist/
4+
npm-debug.log
5+
yarn-error.log
6+
7+
# Editor directories and files
8+
.idea
9+
*.suo
10+
*.ntvs*
11+
*.njsproj
12+
*.sln

‎frontend/package.json‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"name": "frontend",
3+
"description": "A Vue.js project",
4+
"version": "1.0.0",
5+
"author": "",
6+
"private": true,
7+
"scripts": {
8+
"watch": "cross-env NODE_ENV=development webpack --d --watch",
9+
"build_dev": "cross-env NODE_ENV=development webpack --progress --hide-modules",
10+
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
11+
},
12+
"dependencies": {
13+
"axios": "^0.17.0",
14+
"style-loader": "^0.19.0",
15+
"vue": "^2.4.4",
16+
"vuex": "^3.0.1"
17+
},
18+
"devDependencies": {
19+
"babel-core": "^6.26.0",
20+
"babel-loader": "^7.1.2",
21+
"babel-preset-env": "^1.6.0",
22+
"babel-preset-stage-3": "^6.24.1",
23+
"cross-env": "^5.0.5",
24+
"css-loader": "^0.28.7",
25+
"eslint": "^4.18.2",
26+
"eslint-config-standard": "^11.0.0-beta.0",
27+
"eslint-loader": "^1.9.0",
28+
"eslint-plugin-html": "^3.2.2",
29+
"eslint-plugin-import": "^2.8.0",
30+
"eslint-plugin-node": "^5.2.1",
31+
"eslint-plugin-promise": "^3.6.0",
32+
"eslint-plugin-standard": "^3.0.1",
33+
"eslint-plugin-vue": "^4.3.0",
34+
"file-loader": "^1.1.4",
35+
"vue-loader": "^13.0.5",
36+
"vue-template-compiler": "^2.4.4",
37+
"webpack": "^3.6.0",
38+
"webpack-bundle-tracker": "^0.2.0",
39+
"webpack-dev-server": "^2.9.1"
40+
}
41+
}

‎frontend/src/sample/Sample.vue‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<template>
2+
<div class="row">
3+
<div class="col">
4+
</div>
5+
</div>
6+
</template>
7+
8+
<script>
9+
export default {
10+
props: [],
11+
components: {
12+
},
13+
data () {
14+
},
15+
}
16+
</script>
17+
18+
<style>
19+
</style>

‎frontend/src/sample/index.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import Vue from 'vue'
2+
3+
import Sample from './Sample.vue'
4+
5+
new Vue({
6+
el: '#app-sample',
7+
render: h => h(Sample)
8+
})

‎frontend/webpack.config.js‎

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
var path = require('path')
2+
var webpack = require('webpack')
3+
var BundleTracker = require('webpack-bundle-tracker')
4+
5+
module.exports = {
6+
context: __dirname,
7+
entry: {
8+
sample: './src/sample/',
9+
},
10+
output: {
11+
path: path.resolve('../pythonph/assets/webpack_bundles/'),
12+
publicPath: '/assets/webpack_bundles/',
13+
filename: '[name].[chunkhash].js'
14+
},
15+
plugins: [
16+
new BundleTracker({filename: './webpack-stats.json'})
17+
],
18+
module: {
19+
rules: [
20+
{
21+
enforce: 'pre',
22+
test: /\.vue$/,
23+
exclude: /node_modules/,
24+
loader: 'eslint-loader',
25+
},
26+
{
27+
test: /\.vue$/,
28+
loader: 'vue-loader',
29+
options: {
30+
loaders: {
31+
}
32+
// other vue-loader options go here
33+
}
34+
},
35+
{
36+
test: /\.js$/,
37+
loader: 'babel-loader',
38+
exclude: /node_modules(?![\\/]vue-awesome[\\/])/
39+
},
40+
{
41+
test: /\.(png|jpg|gif|svg)$/,
42+
loader: 'file-loader',
43+
options: {
44+
name: '[name].[ext]?[hash]'
45+
}
46+
},
47+
// For bootstrap-vue
48+
{
49+
test: /\.css$/,
50+
loaders: [
51+
'style-loader',
52+
'css-loader'
53+
]
54+
},
55+
// https://gist.github.com/mosinve/00d1c2715dd573c6db38e9ac7139c215#file-webpack-config-js-L49
56+
{test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?mimetype=image/svg+xml'},
57+
{test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?mimetype=application/font-woff'},
58+
{test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?mimetype=application/font-woff'},
59+
{test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?mimetype=application/octet-stream'},
60+
{test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader'},
61+
]
62+
},
63+
resolve: {
64+
alias: {
65+
'vue$': 'vue/dist/vue.esm.js',
66+
'app': path.resolve('./src')
67+
}
68+
},
69+
devServer: {
70+
historyApiFallback: true,
71+
noInfo: true,
72+
overlay: true
73+
},
74+
performance: {
75+
hints: false
76+
},
77+
devtool: '#eval-source-map'
78+
}
79+
80+
if (process.env.NODE_ENV === 'production') {
81+
module.exports.devtool = '#source-map'
82+
// http://vue-loader.vuejs.org/en/workflow/production.html
83+
module.exports.plugins = (module.exports.plugins || []).concat([
84+
new webpack.DefinePlugin({
85+
'process.env': {
86+
NODE_ENV: '"production"'
87+
}
88+
}),
89+
new webpack.optimize.UglifyJsPlugin({
90+
sourceMap: true,
91+
compress: {
92+
warnings: false
93+
}
94+
}),
95+
new webpack.LoaderOptionsPlugin({
96+
minimize: true
97+
})
98+
])
99+
}

‎pythonph/templates/base.html‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
{% load static %}
2+
<!DOCTYPE html>
3+
<html lang="en-us">
4+
<head>
5+
6+
{# Meta Section #}
7+
{% include 'common/metas.html' %}
8+
{% block head_meta %}
9+
{% endblock head_meta %}
10+
11+
<title>
12+
{% block title %}
13+
Python PH
14+
{% endblock title %}
15+
</title>
16+
17+
{# Fonts Section #}
18+
{% include 'common/fonts.html' %}
19+
{% block head_fonts %}
20+
{% endblock head_fonts %}
21+
22+
{# Styles Section #}
23+
{% block head_styles %}
24+
{% include 'common/styles.html' %}
25+
{% endblock head_styles %}
26+
27+
<link rel="icon" type="image/x-icon" href="{% static 'images/favicon.ico' %}">
28+
29+
{# Django JS Reverse #}
30+
{% comment %}
31+
Put this here so that it will be accessible already for the Vue components
32+
{% endcomment %}
33+
<script src="{% url 'js_reverse' %}" type="text/javascript"></script>
34+
35+
</head>
36+
<body>
37+
38+
{% block body %}
39+
40+
{% block header %}
41+
{% include 'common/header.html' %}
42+
{% endblock header %}
43+
44+
{% block content %}
45+
{% endblock content %}
46+
47+
{% block footer %}
48+
{% include 'common/footer.html' %}
49+
{% endblock footer %}
50+
{% endblock body %}
51+
52+
{# JS Section #}
53+
{% include 'common/scripts.html' %}
54+
{% block scripts %}
55+
{% endblock scripts %}
56+
57+
</body>
58+
</html>

0 commit comments

Comments
 (0)