javascript - Browserify working with grunt ReacjJS and yii2 vendor path -

background

i'm trying setup yii2 project browserify manage js dependancies. yii2 places js , css dependancies in vendor/bower directory, i'm trying configure browserify use include path vendor dependancies.

i have grunt task setup run js build.

problem

when try compile js files using grunt task getting error trying find react (the first include in js project).

error: cannot find module 'react' '{my-working-directory}/modules/contact/asset/js'

code

i have react installed (bower install) , available in vendor/bower directory. project js src files i'm trying build located in modules/contact/asset/js/. in js files i'm including react @ top of file.

modules/contact/asset/js/main.jsa

var react = require('react');  var component = react.createclass({     render: function() {        ...     } });  ... 

i have setup grunt browserify task include paths browserify knows how find includes, have additionally added react transform jsx gets compiled 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'     } },  ... 

question

why browserify not able find react or other includes?

you can't , should't access vendor directory web. if website loaded web folder, can access files , folders in web directory.

you can use assetbundle register scripts vendor/bower directory:

class reactasset extends assetbundle {     public $sourcepath = '@bower';     public $js = [         'react/react.js'     ]; } 

see more in documentation.