拉出我的头发寻找一个简单的解决方案,通过NPM,跨多个Browserify或Webpack捆绑包共享代码.思考,有文件"桥"这样的东西吗?
这不是因为编译时间(我知道watchify),而是希望提取出我所有供应商特定的库,vendor.js以便保持我的app.js文件大小并且不会使浏览器崩溃大量的源图.另外,如果需要查看已编译的js,我发现它更清晰.所以:
// vendor.js
require('react');
require('lodash');
require('other-npm-module');
require('another-npm-module');
Run Code Online (Sandbox Code Playgroud)
非常重要的是,代码从NPM加载而不是Bower,或者保存到某个"供应商"目录中,以便通过相对路径导入并通过垫片识别.除了我的实际应用程序源之外,我想通过NPM保留每个库引用.
在app.js我保留所有源代码,并通过externals数组,从编译中排除上面列出的供应商库:
// app.js
var React = require('react');
var _ = require('lodash');
var Component = React.createClass()
// ...
Run Code Online (Sandbox Code Playgroud)
然后index.html,我需要两个文件
// index.html
<script src='vendor.js'></script>
<script src='app.js'></script>
Run Code Online (Sandbox Code Playgroud)
使用Browserify或Webpack,如何才能app.js"看到"通过npm加载的模块?我知道创建一个带有外部的包,然后node_modules通过别名引用直接文件(比方说),但我希望找到一个更自动且更少"Require.js"的解决方案.
基本上,我想知道是否可以桥接这两个,以便app.js可以查看内部vendor.js以解决依赖关系.这似乎是一个简单,直接的操作,但我似乎无法在这个广泛的网络上找到答案.
谢谢!