Question

需要一些requireJS优化器的帮助。我的设置如下：

Django的
JS内部的Django静态文件夹

文件夹结构

- dist
    - copy of /static/ after optimizer (dir)
- django_app01
- django_app02
- django_app ...
- static
    - bower_components
    - js

我在做什么：

在静态文件夹上运行r.js.
r.js选择并将文件移至＆＃34; dist＆＃34;预期的文件夹
更改＆＃34; static_url＆＃34; Django中的设置从＆＃34; dist＆＃34;获取静态文件文件夹中。
加载页面并得到一堆404，因为RequireJS仍在尝试从/ static /...中获取模块。

以下是其尝试获取的网址示例：本地主机/静态/ ... 而不是本地主机/ DIST /...

为什么我在运行优化程序后获得所有这些404的任何想法。我希望r.js优化器能够开始查找/ dist中的所有文件。

build.js：

mainConfigFile : "static/js/require/common.js",
baseUrl: "static",
dir: "dist",
removeCombined: false,
findNestedDependencies: false,
modules: [
  {
    name: "js/require/common"
  },
  ...
]

common.js：

requirejs.config({
  baseUrl: '/static/',
  paths: {
    'jquery': 'bower_components/jquery/dist/jquery.min',
    ...
  },
  'shim': {
    'blah': {
      'deps': [...],
      'exports': 'blah'
    },
    ...
  }
})

HTML：

<head>
    <script src="//cdn.jsdelivr.net/requirejs/2.1.14/require.min.js"></script>
    <script src="{% static 'js/require/common.js' %}"></script>
</head>
<script>
  require(['{% static "js/interviews.js" %}']);
</script>

Answer 1

根据您在问题中显示的内容判断，未优化文件时使用的运行时配置与优化后使用的相同。也就是说，您只有一个common.js文件可以为两种情况设置运行时。此文件设置baseUrl /static/，以便RequireJS查找文件。优化过程不在幕后覆盖此设置。

对于我的项目，我所做的是将需要优化的源放入一个仅用于源（static-src）的目录中。 Django对这个目录一无所知。当我运行make来构建我的项目时，会发生以下两种情况之一：

我创建了一个非优化版本，它将static-src中的所有文件复制到名为build/static-build的目录中。（build下还有其他用于其他目的的子目录。
我制作了一个运行r.js的优化版本。 r.js将其输出放在build/static-build。

在任何一种情况下，一切都在同一个位置。 STATICFILES_DIRS设置settings以在运行collectstatic时从此目录中获取文件。我的服务器设置为从/static/收集静态文件的位置提供STATIC_URL（collectstatic}个文件的值。

这只是一个例子。您可以使用除make之外的其他内容。你当然可以使用不同的目录名称。您可能有一个更简单的构建过程。（当我对Django很新的时候，我创建了它，并且从不打扰它。）

Answer 2

好的，想出如何在不使用观察者，make或任何其他文件夹复制脚本疯狂的情况下执行此操作。

requireJS允许您在HTML顶部加载require.js lib之前设置默认变量。

我之前配置所做的更改包括： - 不再在模块定义中定义baseUrl（requirejs.config） - 根据环境将baseUrl定义为默认值。

build.js：

mainConfigFile : "static/js/require/common.js",
baseUrl: "static",
dir: "dist",
removeCombined: false,
findNestedDependencies: false,
modules: [
  {
    name: "js/require/common"
  },
  ...
]

common.js：

requirejs.config({
  // baseUrl: '/static/', DO NOT DEFINE baseUrl here anymore
  paths: {
    'jquery': 'bower_components/jquery/dist/jquery.min',
    ...
  },
  'shim': {
    'blah': {
      'deps': [...],
      'exports': 'blah'
    },
    ...
  }
})

HTML：

<head>
    <!-- Define the baseUrl depending on environment -->
    <script>
        var require = {
            baseUrl: {% if debug %}'/static/'{% else %}'/dist/'{% endif %}
        }
    </script>
    <script src="//cdn.jsdelivr.net/requirejs/2.1.14/require.min.js"></script>
    <script src="{% static 'js/require/common.js' %}"></script>
</head>
<script>
  require(['{% static "js/interviews.js" %}']);
</script>

RequireJS Optimizer - 仍在尝试从旧目录加载文件 - 带Django

2 个答案: