如何将browserify库模块作为常规文件部署到依赖项目中?

时间:2017-12-28 07:01:11

标签: javascript npm browserify

我使用browserify --standalone创建了一个JavaScript库模块,可以使用npm test查找。我正在尝试创建一个在浏览器中使用库模块的演示应用程序。 npm updatenode_modules/library/blah.js下安装库模块。我可以将演示应用程序设置为从该位置将库服务器移植到浏览器,一切正常。我宁愿有一个命令将该文件从该位置复制(并理想地重命名)到顶级文件夹中。然后库模型将是演示应用程序的普通旧js文件。最简单的方法是什么?

更新:我想复制和重命名库文件的原因是它可以轻松地与其他技术一起使用,这些技术可以压缩所有js文件以将它们部署到Web服务器。

1 个答案:

答案 0 :(得分:0)

相关问题是How to use npm with ASP.NET Core,它询问如何在希望浏览器JavaScript位于文件夹npm install的Web应用程序中使用wwwroot安装JavaScript。我实际上并没有使用ASP.NET,但它证明了有人想在浏览器中使用我的npm库代码可能想要将库文件从npm安装文件夹node_modules复制到浏览器可见的其他文件夹中。

accepted answer over there建议使用gulp复制文件。它声称gulp是VS(visual studio)"的首选任务选择。有a lot of other task runners所以你可以选择自己的。{3}}。快速浏览gulp examples我最终提出了this gist,恕我直言看起来非常清晰和实用。

这导致我将以下行添加到package.json "scripts": { "prepare": "gulp minify" }, ,每当npm install is run时都有npm run gulp:

gulpfile.js

然后创建一个剥离的gist的自己版本"use strict"; var _ = require('lodash'), gulp = require('gulp'), uglify = require('gulp-uglify'), rename = require('gulp-rename'); var js = [ './node_modules/thinbus-srp/browser.js' ]; gulp.task('copy-min-js', function () { _.forEach(js, function (file, _) { gulp.src(file) .pipe(uglify()) .pipe(rename({ extname: '.thinbus.js' })) .pipe(gulp.dest('.')) }); }); gulp.task('minify', ['copy-min-js']); ,将库文件复制到顶级文件夹,并重命名其扩展名,说明该文件来自哪个库:

npm install

这意味着每次使用www.mysite.com/contact?id=4ijr3943jwswER4we更新库时,最新的库文件都会被复制并重命名为顶级文件夹,浏览器可以加载它。