(“使用npm.js依赖项和transpile es2015+”的django包,)
django-npm-mjs的Python项目详细描述
Django NPM MJS
使用npm.js依赖项和transpile es2015+的django包
fidus writer使用这个包来捆绑javascript。我们尽量保持它的通用性,因此,如果有什么东西看起来非常奇怪和具体的fidus作家,这很可能只是我们的疏忽。请联系我们,我们会看看我们能做些什么。
这个包类似于django压缩器,它在javascript文件提供给用户之前处理它们。但也有一些不同:
它不会混合不同的javascript模块条目文件。它只打包从一个条目文件导入的所有内容。使用es2015+时,不需要在全局命名空间中运行大量javascript文件。
它允许从一个django应用程序导入到同一个项目中的另一个应用程序,就像它们在同一个文件夹中一样,类似于django处理静态文件和模板的方式。
它包括处理npm.js导入。
javascript条目文件的基本名称不会更改,并且添加了一个自动版本查询,以便能够擦除浏览器缓存(
/js/my_file.mjs
变为/js/my_file.js?v=239329884
)。这样也可以从javascript引用url(例如用于web工作者)。它允许在django应用程序之间使用javascript插件钩子,当django项目可以与特定应用程序一起使用或不使用特定应用程序时,并且来自一个应用程序的javascript需要从另一个应用程序导入内容。
快速启动
安装“npm_mjs”
pip install django-npm-mjs
将“npm_mjs”添加到已安装的应用程序设置中,如下所示:
INSTALLED_APPS = [ ... 'npm_mjs', ]
在设置中将
PROJECT_PATH
定义为项目的根文件夹:PROJECT_PATH = os.path.realpath(os.path.join(os.path.dirname(__file__), '..'))
在设置中定义一个
SETTINGS_PATHS
以包含所有设置文件的路径(settings.py+任何本地设置.py或您可能已定义的类似文件):SETTINGS_PATHS = [os.path.dirname(__file__), ]
将
PROJECT_PATH
中的static-transpile
文件夹添加到STATICFILES_DIRS
中,如下所示:STATICFILES_DIRS = ( os.path.join(PROJECT_PATH, 'static-transpile'), ... )
加载transfile,并使用
static
模板标记来引用javascript文件。 ES2015+模块的所有条目文件都需要有*.mjs结尾。条目可以如下所示:{% load transpile %} ... <script type="text/javascript" src="{% static "js/index.mjs" %}"></script>
使用static
模板标记:
<link type="text/css" rel="stylesheet" href="{% static "css/fonts.css" %}" />
运行
./manage.py transpile
。运行
./manage.py runserver
。您的ES2015+模块将作为与浏览器兼容的JS文件使用,所有静态文件都将以版本控制结尾,以便您可以将静态服务器设置为允许浏览器无限期缓存静态文件,只要Debug设置为False。
npm.js依赖项
将package.json文件添加到一个或多个应用程序中。所有package.json文件都将被合并。
从package.json文件中指定的任何npm模块导入js文件。
运行
./manage.py transpile
。运行
./manage.py runserver
。
参考javascript源代码中的transpile版本
在javascript源代码中,您可以引用上次transfile运行的版本字符串,如下所示:
process.env.TRANSPILE_VERSION
例如:
let downloadJS = `download.js?v=${process.env.TRANSPILE_VERSION}` // Latest version of transpiled version of download.mjs