Browserify使用grunt ReacjJS和yii2供应商路径
背景
我正在尝试使用Browserify设置Yii2项目来管理JS依赖关系。 由于Yii2将JS和CSS依赖放置在vendor/bower
目录中,我试图将Browserify配置为使用它作为供应商依赖的包含路径。
我有一个Grunt任务设置来运行我的js构建。
问题
当我尝试使用Grunt任务编译我的js文件时,发现尝试查找React
(第一个包含在我的js项目中)的错误。
Error: Cannot find module 'react' from '{my-working-directory}/modules/contact/asset/js'
码
我安装了React(bower install),并在我的vendor/bower
目录中提供。 我正在尝试构建的项目JS src文件位于modules/contact/asset/js/
。 在我的JS文件中,我在文件的顶部添加了React。
模块/接触/资产/ JS / main.jsa
var React = require('react');
var component = React.createClass({
render: function() {
...
}
});
...
我已经使用包含路径设置了Grunt browserify任务,以便browserify知道如何找到我的包含,我还额外添加了反应转换,以便将JSX编译为js。
Gruntfile.js
...
browserify: {
options: {
transform: [ require('grunt-react').browserify ],
browserifyOptions: {
paths: [
'./vendor/bower/',
'./modules/contact/asset/js/'
]
}
},
client: {
src: [
'./modules/contact/asset/js/*.js'
],
dest: './modules/contact/web/js/main.min.js'
}
},
...
题
为什么browserify无法找到反应或其他包含?
您不能也不应该从Web访问vendor
目录。 如果您的网站从web
文件夹加载,那么您只能访问web
目录中的文件和文件夹。
您可以使用AssetBundle
从vendor/bower
目录注册脚本:
class ReactAsset extends AssetBundle
{
public $sourcePath = '@bower';
public $js = [
'react/react.js'
];
}
在文档中查看更多。
链接地址: http://www.djcxy.com/p/52107.html上一篇: Browserify working with grunt ReacjJS and yii2 vendor path