Merge pull request #18 from aamirbhat/develop

Develop

Author: aamirbhat

README.md

@@ -67,7 +67,7 @@ STATICFILES_DIRS = (
         'DEFAULT': {
             'BUNDLE_DIR_NAME': REACT_BUILD_DIRECTORY,  
             'FRONT_END_SERVER': "http://localhost:3000/",
-            'is_dev': False,
+            'IS_DEV': False,
         }
     }
 ```
@@ -96,14 +96,16 @@ STATICFILES_DIRS = (
 
 CREATE_REACT_APP = {
     'DEFAULT': {
-        'BUNDLE_DIR_NAME': CLIENT_FRONTEND_BUILD,
+        'BUNDLE_DIR_NAME': REACT_BUILD,
         'FRONT_END_SERVER': "http://localhost:3000/",
-        'is_dev':  True,
-    },
+        'IS_DEV': False,
+        "PUBLIC_PATH_DEV": "http://localhost:3000/",
+        "PUBLIC_PATH": "/static/"
+    }
     'ADMIN': {
-        'BUNDLE_DIR_NAME': ADMIN_FRONTEND_BUILD,
-        'FRONT_END_SERVER': "http://localhost:3001/",
-        'is_dev': True,
+        'BUNDLE_DIR_NAME': REACT_BUILD,
+        'FRONT_END_SERVER': "http://localhost:3000/",
+        'IS_DEV': False,
     },
 }
 
@@ -113,6 +115,9 @@ make sure react app is running on FRONT_END_SERVER on same port which is declare
 #### is_dev: False
 make sure build path is pointed to the right build directory 
 
+
+
+
 ### Rendering react admin app inside templates :: 
 ```
 {% load react_bundle_loader %}
@@ -128,3 +133,37 @@ make sure build path is pointed to the right build directory
 </head>
     
 ```
+
+
+### Using Preloading ::
+The is_preload=True option in the render_bundle_css or render_bundle_js template tag can be used to add rel="preload" link tags.
+```
+{% render_bundle_css is_preload=True %}
+
+```
+
+### Add attributes
+add some extra attributes to the tag
+```
+{% render_bundle_js  attrib="async" %}
+
+{% render_bundle_js  attrib="disabled" %}
+```
+
+
+### migration from 0.8.4 to 0.9
+"is_dev" changed to "IS_DEV" 
+is_dev in lowercase will not work 
+
+
+### docker support
+PUBLIC_PATH_DEV default value will be FRONT_END_SERVER, which will be used for incase of docker
+
+PUBLIC_PATH_DEV will be used in case of docker to http://localhost:3000/
+FRONT_END_SERVER: host.docker.internal
+
+### django storage support
+
+change PUBLIC_PATH to storagepath e.g
+
+PUBLIC_PATH:"https://234234234.aws.com/static/"

create_react_app/asset.py

@@ -0,0 +1,64 @@
+from create_react_app.config import get_loader
+from create_react_app.utils import _filter_by_extension
+
+
+class AssetTag:
+    def __init__(self, public_path):
+        self.public_path = public_path
+
+    def css_tag(self, asset_path, attrib="", is_preload=False):
+        if is_preload:
+            return '<link rel="preload"  href="{0}{1}" {2} as="style" />'.format(self.public_path, asset_path, attrib)
+        return '<link type="text/css" href="{0}{1}" rel="stylesheet" {2}/>'.format(self.public_path, asset_path, attrib)
+
+    def script_tag(self, asset_path, attrib="", is_preload=False):
+        if is_preload:
+            return '<link rel="preload"  href="{0}{1}" {2} as="script" />'.format(self.public_path, asset_path, attrib)
+        return '<script type="text/javascript" src="{0}{1}" {2}></script>'.format(self.public_path, asset_path, attrib)
+
+    def src(self, asset_path, **extra):
+        return '{0}{1}'.format(self.public_path, asset_path)
+
+
+class AssetManager(object):
+    def __init__(self, config_name):
+        self.loader = get_loader(config_name)
+        self.asset = AssetTag(self.loader.asset_path)
+
+    def get_bundle(self, extension):
+        bundle = self.loader.get_bundle()
+        if extension:
+            bundle = _filter_by_extension(bundle, extension)
+        if not bundle:
+            return []
+        return bundle
+
+    def get_tag_bundle(self, extension, call_back, ends_with=[], **extra):
+        tags = []
+        bundle = self.get_bundle(extension=extension)
+        for chunk in bundle:
+            if not self.loader.is_dev:
+                chunk = chunk.replace("static/", "")
+            if chunk.endswith(tuple(ends_with)):
+                tags.append(call_back(chunk, **extra))
+        return tags
+
+    def css_callback(self, chunk, **extra):
+        return self.asset.css_tag(chunk, **extra)
+
+    def js_callback(self, chunk, **extra):
+        return self.asset.script_tag(chunk, **extra)
+
+    def css_tags(self, **extra):
+        return self.get_tag_bundle(extension="css", call_back=self.css_callback, ends_with=['.css', '.css.gz'], **extra)
+
+    def js_tags(self, **extra):
+        return self.get_tag_bundle(extension="js", call_back=self.js_callback, ends_with=['.js', '.js.gz'], **extra)
+
+
+class SrcAssetManager(AssetManager):
+    def js_callback(self, chunk, **extra):
+        return self.asset.src(chunk, **extra)
+
+    def css_callback(self, chunk, **extra):
+        return self.asset.src(chunk, **extra)

create_react_app/config.py

@@ -1,16 +1,22 @@
 import re
 
 from django.conf import settings
+from importlib import import_module
 
 __all__ = ('load_config',)
 
+_loaders = {}
+ASSET_LOADER_CACHE = getattr(settings, "RUNTIME_ASSET_LOADER", False)
+
 DEFAULT_CONFIG = {
     'DEFAULT': {
         'CACHE': True,
         'BUNDLE_DIR_NAME': '/Users/aamirbhatt/workspace/hack_django_react/dashboard/static',
         'LOADER_CLASS': 'create_react_app.loader.CreateReactLoader',
         'FRONT_END_SERVER': "http://localhost:3000/",
-        'is_dev': False,
+        'PUBLIC_PATH': "/static/",
+        "PUBLIC_PATH_DEV": "/",
+        'IS_DEV': False
     }
 }
 
@@ -24,3 +30,25 @@
 
 def load_config(name):
     return user_config[name]
+
+
+def import_string(dotted_path):
+    '''
+    This is a rough copy of django's import_string, which wasn't introduced until Django 1.7
+    Once this package's support for Django 1.6 has been removed, this can be safely replaced with
+    `from django.utils.module_loading import import_string`
+    '''
+    try:
+        module_path, class_name = dotted_path.rsplit('.', 1)
+        module = import_module(module_path)
+        return getattr(module, class_name)
+    except (ValueError, AttributeError, ImportError):
+        raise ImportError('%s doesn\'t look like a valid module path' % dotted_path)
+
+
+def get_loader(config_name, manifest_path=None):
+    if config_name not in _loaders or ASSET_LOADER_CACHE:
+        config = load_config(config_name)
+        loader_class = import_string(config['LOADER_CLASS'])
+        _loaders[config_name] = loader_class(config, manifest_path)
+    return _loaders[config_name]

create_react_app/loader.py

@@ -1,10 +1,7 @@
 import json
 import os
-import time
 from io import open
 
-from django.conf import settings
-from django.contrib.staticfiles.storage import staticfiles_storage
 
 from .exception import (
     WebpackError,
@@ -21,17 +18,34 @@ class CreateReactLoader(object):
 
     def __init__(self, config, manifest_path=None):
         self.config = config
-        self.is_dev = self.config.get("is_dev", False)
-        self.manifest_path = manifest_path
+        self.manifest_file_path = manifest_path
+
+    @property
+    def is_dev(self):
+        return self.config.get("IS_DEV", False)
+
+    def get_dev_path(self):
+        dev_asset_path = self.config['FRONT_END_SERVER']
+        public_path_dev = self.config.get("PUBLIC_PATH_DEV")
+        if public_path_dev != "/":
+            dev_asset_path = public_path_dev
+
+        return dev_asset_path.strip('/') + "/"
 
     @property
     def asset_path(self):
+        public_path = self.config.get("PUBLIC_PATH")
         if self.is_dev:
-            return self.config['FRONT_END_SERVER'].strip('/') + "/"
-        return "/"
+            return self.get_dev_path()
+        return public_path
+
+    @property
+    def manifest_path(self):
+        dev_asset_path = self.config['FRONT_END_SERVER']
+        return dev_asset_path.strip('/') + "/"
 
     def get_dev_assets(self):
-        server = self.asset_path
+        server = self.manifest_path
         url = "{frontend_server}{asset_file}".format(frontend_server=server, asset_file=self.asset_file)
         try:
             data = requests.get(url, timeout=3)
@@ -44,8 +58,8 @@ def get_dev_assets(self):
     def get_prod_assets(self):
         try:
             build_folder = self.config['BUNDLE_DIR_NAME']
-            if self.manifest_path:
-                manifest_file = self.manifest_path
+            if self.manifest_file_path:
+                manifest_file = self.manifest_file_path
             else:
                 manifest_file = os.path.join(build_folder, self.asset_file)
             with open(manifest_file, encoding="utf-8") as f:
@@ -56,7 +70,7 @@ def get_prod_assets(self):
                 'the asset-manifest file in the build directory and the path is correct?')
 
     def get_assets(self):
-        if self.is_dev and not self.manifest_path:
+        if self.is_dev and not self.manifest_file_path:
             return self.get_dev_assets()
         return self.get_prod_assets()
 

create_react_app/templatetags/react_bundle_loader.py

@@ -1,65 +1,29 @@
 from django import template
 from django.utils.safestring import mark_safe
-
-from .. import utils
+from ..asset import AssetManager, SrcAssetManager
 
 register = template.Library()
 
 
 @register.simple_tag
-def render_bundle_css(config="DEFAULT"):
-    tags = utils.get_as_tags(extension='css', config=config)
+def render_bundle_css(config="DEFAULT", is_preload=False, attrib=''):
+    tags = AssetManager(config).css_tags(is_preload=is_preload, attrib=attrib)
     return mark_safe('\n'.join(tags))
 
 
 @register.simple_tag
-def render_bundle_js(config="DEFAULT"):
-    tags = utils.get_as_tags(extension='js', config=config)
+def render_bundle_js(config="DEFAULT", is_preload=False, attrib=''):
+    tags = AssetManager(config).js_tags(is_preload=is_preload, attrib=attrib)
     return mark_safe('\n'.join(tags))
 
+
 @register.simple_tag
 def render_bundle_src_css(config="DEFAULT"):
-    tags = utils.get_src_files(extension='css', config=config)
+    tags = SrcAssetManager(config).css_tags()
     return tags
 
 
 @register.simple_tag
 def render_bundle_src_js(config="DEFAULT"):
-    tags = utils.get_as_tags(extension='js', config=config)
+    tags = SrcAssetManager(config).js_tags()
     return tags
-
-
-@register.simple_tag
-def render_bundle_page_css(page_name="main", config="DEFAULT"):
-    tags = utils.get_tags_per_page(extension='css', page_name=page_name, config=config)
-    return mark_safe('\n'.join(tags))
-
-
-@register.simple_tag
-def render_bundle_page_js(page_name="main", config="DEFAULT"):
-    tags = utils.get_tags_per_page(extension='js', page_name=page_name, config=config)
-    return mark_safe('\n'.join(tags))
-
-@register.simple_tag
-def render_asset_page_css(page_name="main", manifest_path=None):
-    tags = utils.get_tags_per_page(extension='css', page_name=page_name, manifest_path=manifest_path)
-    return mark_safe('\n'.join(tags))
-
-
-@register.simple_tag
-def render_asset_page_js(page_name="main", manifest_path=None):
-    tags = utils.get_tags_per_page(extension='js', page_name=page_name, manifest_path=manifest_path)
-    return mark_safe('\n'.join(tags))
-
-
-
-@register.simple_tag
-def render_bundle_page_src_css(page_name="main", config="DEFAULT"):
-    tags = utils.get_src_files(extension='css', page_name=page_name, config=config)
-    return mark_safe('\n'.join(tags))
-
-
-@register.simple_tag
-def render_bundle_page_src_js(page_name="main", config="DEFAULT"):
-    tags = utils.get_src_files(extension='js', page_name=page_name, config=config)
-    return mark_safe('\n'.join(tags))