创建一个JS库并声明其他库依赖什么
Creating a JS library and declare what other libraries in depends on
所以我正在写一个 php-package,它将被放在 github&packagist 上。它生成数据并将其写入文件,该包还将附带一个 js 库,该库的工作是读取该数据文件并将其显示给用户。
现在,这个 js 库依赖于其他库,jquery 是其中的一个。
声明这些依赖项的简洁方法是什么?
我不介意使用 require.js,事实上我已经将它用于其他几个项目。但是那些项目已经完成 "apps",而不是其他人要包含在他们的项目中的库。所以在那些情况下,添加依赖项和配置 require.js 并不重要,而且只需要完成一次。但是这次我希望能够用最少的代码包含这个库,最好不要长篇大论地说明如何正确加载它以及开发人员还需要加载哪些其他库。
简而言之:我想分发一个依赖于其他库的库,我或其他开发人员可以使用最少的代码将其包含在另一个项目中,并且不知道这个库依赖于哪些其他库。
我确定以前有人问过这个问题,但我似乎找不到任何关于它的内容。我确实找到了很多关于如何在主项目中声明依赖项的信息,但在库中没有。
你有两个选择:
- 将您的应用程序捆绑到一个文件中(包括第 3 方库)
- 只需将您的应用程序捆绑到一个文件中(不包括第 3 方库)
在这两种情况下,您都需要创建一个自动构建。您可以使用 gulp 创建任务,将所有文件连接成一个文件,例如其他开发人员将导入的 framework.js
和 framework.min.js
文件。
你可以使用 如果你使用 require.js 你可以使用 gulp-requirejs plugin to run the requirejs optimizer:
var gulp = require('gulp'),
rjs = require('gulp-requirejs');
gulp.task('requirejsBuild', function() {
rjs({
baseUrl: 'path/to/your/base/file.js',
out: 'FILENAME\_TO\_BE\_OUTPUTTED',
shim: {
// standard require.js shim options
},
// ... more require.js options
})
.pipe(gulp.dest('./delpoy/')); // pipe it to the output DIR
});
如果您决定也包含第 3 方库,请使用 No conflict fucntion 以避免在有人已经加载时出现问题 jquery。
如果您决定不包含库,您可以在库的全局范围内查找一些变量,如果依赖项不可用则抛出错误。
if(typeof $ === "undefined") throw new Error("Framework requires > Jquery 1.9.0");
您通常可以轻松找到库的版本,例如 jquery:
$.prototype.jquery
更新
我个人建议使用 Browserify. If you are using requirejs, you can use browserify-ftw 自动将您的项目从 AMD 迁移到 CommonJS。
Browserify 优化器将生成一个 bundle.js
文件,您的用户可以直接导入该文件,而无需下载第 3 方依赖项或配置模块加载器。
希望对您有所帮助:)
所以我正在写一个 php-package,它将被放在 github&packagist 上。它生成数据并将其写入文件,该包还将附带一个 js 库,该库的工作是读取该数据文件并将其显示给用户。 现在,这个 js 库依赖于其他库,jquery 是其中的一个。
声明这些依赖项的简洁方法是什么?
我不介意使用 require.js,事实上我已经将它用于其他几个项目。但是那些项目已经完成 "apps",而不是其他人要包含在他们的项目中的库。所以在那些情况下,添加依赖项和配置 require.js 并不重要,而且只需要完成一次。但是这次我希望能够用最少的代码包含这个库,最好不要长篇大论地说明如何正确加载它以及开发人员还需要加载哪些其他库。
简而言之:我想分发一个依赖于其他库的库,我或其他开发人员可以使用最少的代码将其包含在另一个项目中,并且不知道这个库依赖于哪些其他库。
我确定以前有人问过这个问题,但我似乎找不到任何关于它的内容。我确实找到了很多关于如何在主项目中声明依赖项的信息,但在库中没有。
你有两个选择:
- 将您的应用程序捆绑到一个文件中(包括第 3 方库)
- 只需将您的应用程序捆绑到一个文件中(不包括第 3 方库)
在这两种情况下,您都需要创建一个自动构建。您可以使用 gulp 创建任务,将所有文件连接成一个文件,例如其他开发人员将导入的 framework.js
和 framework.min.js
文件。
你可以使用 如果你使用 require.js 你可以使用 gulp-requirejs plugin to run the requirejs optimizer:
var gulp = require('gulp'),
rjs = require('gulp-requirejs');
gulp.task('requirejsBuild', function() {
rjs({
baseUrl: 'path/to/your/base/file.js',
out: 'FILENAME\_TO\_BE\_OUTPUTTED',
shim: {
// standard require.js shim options
},
// ... more require.js options
})
.pipe(gulp.dest('./delpoy/')); // pipe it to the output DIR
});
如果您决定也包含第 3 方库,请使用 No conflict fucntion 以避免在有人已经加载时出现问题 jquery。
如果您决定不包含库,您可以在库的全局范围内查找一些变量,如果依赖项不可用则抛出错误。
if(typeof $ === "undefined") throw new Error("Framework requires > Jquery 1.9.0");
您通常可以轻松找到库的版本,例如 jquery:
$.prototype.jquery
更新
我个人建议使用 Browserify. If you are using requirejs, you can use browserify-ftw 自动将您的项目从 AMD 迁移到 CommonJS。
Browserify 优化器将生成一个 bundle.js
文件,您的用户可以直接导入该文件,而无需下载第 3 方依赖项或配置模块加载器。
希望对您有所帮助:)