Оптимизация требований
-
20-12-2019 - |
Вопрос
Я использую R.js, чтобы оптимизировать мое приложение, Как я видел в нескольких образцах, я использовал файл конфигурации Build.json, чтобы настроить свои параметры оптимизации.
Проблема в том, что когда я устанавливаю ссылку на выходной файл JavaScript после оптимизации, я получаю следующую ошибку в браузере:
Uncupt ChareError: Определение не определена Main-Setting.js: 14735
Похоже, все мои модули приложений существуют, но требуется отсутствует.
Это мой файл конфигурации build.json:
{
"baseUrl": "../",
"name": "src/modules/main",
"include": ["src/modules/main", "src/modules/navbar/navbar", "src/modules/contact/contact", "src/modules/about/about"],
"exclude": [], "optimize": "none", "out": "main-built.js",
"insertRequire": ["src/modules/main"]
}
.
Как добавить потребности в файл вывода JS?Может быть, мне нужно добавить что-то еще на конфин?или, может быть, проблема не на конфиге?
Спасибо, ORI
Решение
попробуйте:
<script src="scripts/require.js" data-main="scripts/main-built"></script>
. Другие советы
Если я правильно понял, вот как это должно работать.
Что делает R.JS, так это то, что он компилирует все модули TIENJS в один файл.Однако вам все еще нужно загрузить этот файл с помощью скрипта TIENEJS, например:
<script data-main="scripts/main" src="scripts/require.js"></script>
.
Так что просто добавьте минимуму дорабоченную версию require.js на ваш сайт и загрузите оптимизированный модуль, используя это.
Вы должны включить require.js
, если у вас модулизован ваш проект, используя EMENJS:
<script data-main="scripts/main" src="scripts/require.js"></script>
.
Это связано с тем, что потребление данных обрабатывает загрузку модулей и разрешающих зависимостей.Без этого ваш браузер не знает, что означает генеракодицетагкод.Способ обойти это состоит в том, чтобы использовать UMD (универсальный модуль определения).Это делает его таким, чтобы ваш модуль можно было использовать с или без потребностей в или без.Вы можете увидеть много примеров Здесь .Тот, который соответствует вашему примещению:
// Uses AMD or browser globals to create a module.
// If you want something that will also work in Node, see returnExports.js
// If you want to support other stricter CommonJS environments,
// or if you need to create a circular dependency, see commonJsStrict.js
// Defines a module "amdWeb" that depends another module called "b".
// Note that the name of the module is implied by the file name. It is best
// if the file name and the exported global have matching names.
// If the 'b' module also uses this type of boilerplate, then
// in the browser, it will create a global .b that is used below.
// If you do not want to support the browser global path, then you
// can remove the `root` use and the passing `this` as the first arg to
// the top function.
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module.
define(['b'], factory);
} else {
// Browser globals
root.amdWeb = factory(root.b);
}
}(this, function (b) {
//use b in some fashion.
// Just return a value to define the module export.
// This example returns an object, but the module
// can return a function as the exported value.
return {};
}));
.