常連

詳細
以下のページの添付の画像のようにブラウザの検索欄右のアイコンをクリックすると「このページは承認されていないソースからのスクリプトを読み込もうとしています」と表示されます。
どのように対処すればよいでしょうか？

該当ページ：[https://wonect.com/sg/customer/account/create/](https://wonect.com/sg/customer/account/create/)

※参考画像
![イメージ説明](2d1c1b4904364bcfa06336c6e19fe73c.png)

あるページで「このページは承認されていないソースからのスクリプトを読み込もうとしています」と表示されていることに対処するにはどうすればよいでしょうか？

Gulpでbrowserifyやbabelifyなどを使ってReactのソースをビルドしているんですが、
対象のJavaScriptファイルに単純な構文エラー(カッコが足りない、JSXの構文ミスなど)が発生すると
`gulp.watch`が止まってしまいます。

gulp-plumberを使うと継続できる、とか、
`.on('error', function(){})`でハンドリングできる、など
いくつか対策を見つけたのですが、watchが止まる状況は変わりませんでした。

Gulpの知識が無いので、記述が良くなくて効果が無いだけなのかもしれないのですが、
Gulp+Browserify+babelify+uglify+Reactな環境でエラー発生後もwatchが継続できるように
gulpfile.jsを記述したいです。

gulpfile.js
```JavaScript
gulp.task('build', function() {
	return gulp.src('src/js/*.js')
		.pipe(plumber())
		.pipe(through2.obj(function(file, encode, callback){
			browserify(file.path)
				.transform(babelify)
				.bundle(function(err, res){
						file.contents = res;
						callback(null, file)
				})
				.on('error', console.log('error'))
		}))
		.pipe(uglify({preserveComments: 'some'}))
		.pipe(gulp.dest('./build/js/'));
});
```

```JSON
  "devDependencies": {
    "babelify": "^6.3.0",
    "browser-sync": "^2.9.6",
    "browserify": "^11.2.0",
    "del": "^2.0.2",
    "gulp": "^3.9.0",
    "gulp-plumber": "^1.0.1",
    "gulp-uglify": "^1.4.1",
    "gulp-watchify": "^0.5.0",
    "react": "^0.13.3",
    "run-sequence": "^1.1.4",
    "through2": "^2.0.0",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "vinyl-transform": "^1.0.0"
  }
```

Gulpでエラー発生時にwatchを継続したい

###実現したいこと
gulpで[Browserify](https://www.npmjs.com/package/browserify)を使ってjqueryやvue.jsをimportしたいです。

###試してみた事
```bash
npm install --save jquery vue
npm install --save-dev browserify
```

package.jsonと明記しているjs(main.js)は下記です。
```javascript
...<省略>
"dependencies": {
    "jquery": "^3.2.1",
    "vue": "^2.5.13"
  },
  "browser": {
    "vue": "vue/dist/vue.common.js"
  }
```

```javascript
//main.js
import Vue from 'vue';
const $ = require('jquery');

new Vue({
  el: '#app',
  components: {}
});

/* babel変換後のjsファイルはこちら

'use strict';
var _vue = require('vue');
var _vue2 = _interopRequireDefault(_vue);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var $ = require('jquery');
new _vue2.default({
  el: '#app',
  components: {}
});

*/

```

main.jsに関してはbabelで変換しています。

importを使う方法、requireを使う方法、両方で明記してみましたが,
どちらも"Uncaught ReferenceError: require is not defined"になってしまいます。

Gulp初心者で恐縮ですが、どの記述が問題なのかわからず、ご教示いただけると幸いです。

よろしくお願いします。

Browserifyでrequireできない

AngularJS (v1.5.6) とes6をでサービスを制作している者です。

`angular-ui-sortable` というライブラリを使って要素をドラッグで並び替えるUIを作成しているのですが、このライブラリがjQueryとjQueryUIに依存しているため、仕方なくそれらを使おうと思っています。

以下の様なコードを書いたところ、 `ui.sortable: jQuery should be included before AngularJS!` というエラーが出てうまく動きませんでした。

```lang-javascript
'use strict';

import 'jquery';
import 'jquery-ui';
import angular from 'angular';
import 'angular-ui-sortable';

class MainController {

  constructor() {
    this.items = [
      { name: 'aaa', age: 15 },
      { name: 'bbb', age: 16 },
      { name: 'ccc', age: 17 }
    ];
  }
}

angular.module('app', ['ui.sortable'])
  .controller('MainController', MainController);
```

```lang-html
<html ng-app="app">
  <head>
    <title>Test</title>
  </head>
  <body ng-controller="MainController as main">
    <div ui-sortable ng-model="main.items">
      <div ng-repeat="item in main.items">
        <p>{{ item.name }}</p>
        <p>{{ item.age }}</p>
      </div>
    </div>
    <script src="bundle.js"></script>
  </body>
</html>
```

エラーメッセージの内容から、importされる順番に問題があるのかと思い、上記のコードをトランスパイルした際にできるファイルを見てみると、なぜかjQueryではなくAngularJSのコードが最初に記載されていました。

なぜそのような順番でトランスパイルされるのか、またその順番を制御する方法があるのか、ご存知の方がいらっしゃいましたらご回答をよろしくお願いします。

※トランスパイルはBrowserifyとbabelifyを使っています
※jQueryとjQueryUIを `script` タグを使って `bundle.js` の前に読み込めば問題なく動作します

【es6】import される順番を制御したい

babelとbabelifyをデスクトップにローカルインストールし、Browserifyをグローバルインストールしました。
babelのコマンド（`babel /Users/north/Desktop/sample.js -o /Users/north/Desktop/sample3.js`）によって正常にJavaScriptがnode.jsの記述に変換されていることは確認できています。
しかし、JavaScriptを古いバージョンのJavaScriptに変換するための以下のコマンドが実行できません。

`browserify /Users/north/Desktop/sample.js /Users/north/Desktop/sample2.js -t [babelify --presets es2015] -o /Users/north/Desktop/sample4.js`

これは何が原因なのでしょうか。

最初、デスクトップにpackage.jsonがなかったので`npm init`でpackage.jsonを作りましたが、特に関係がなかったようです。

（エラーメッセージ）
```
/Users/north/Desktop/node_modules/babelify/index.js:16
  throw err;
  ^

Error: Cannot find module '@babel/core'
 babelify@10 requires Babel 7.x (the package '@babel/core'). If you'd like to use Babel 6.x ('babel-core'), you should install 'babelify@8'.
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Module.require (internal/modules/cjs/loader.js:692:17)
    at require (internal/modules/cjs/helpers.js:25:18)
    at Object.<anonymous> (/Users/north/Desktop/node_modules/babelify/index.js:9:11)
    at Module._compile (internal/modules/cjs/loader.js:778:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
```

##（追記：）
###Babel7をインストールするために行なったコマンド（→インストール不可））
```
npm install --save-dev @babel/core @babel/cli @babel/preset-env
```
[インストールのための参考サイト](https://chaika.hatenablog.com/entry/2018/11/21/150000)

###エラーメッセージ
```
npm WARN desktop@1.0.0 No description
npm WARN desktop@1.0.0 No repository field.

+ @babel/cli@7.7.0
+ @babel/core@7.7.2
+ @babel/preset-env@7.7.1
updated 3 packages and audited 6616 packages in 5.261s
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
```

##（追記2：）
デスクトップにBabel7をインストールしようとしたのでデスクトップ上にBabelが作成されると思っていたためインストールに失敗したと思いましたが、デスクトップ上のnode_modulesディレクトリ内に作成されたのかもしれないと思い当たりました。
しかし、`babel --version`でBabelバージョンを確認すると`6.26.0 (babel-core 6.26.3)`なのでバージョンは変わっていませんでした。
次に`npm audit`を実行しました。

（npm auditの結果）
```
Low           │ Regular Expression Denial of Service                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ braces                                                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=2.3.1                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ babel-cli                                                    │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ babel-cli > chokidar > anymatch > micromatch > braces        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/786    
```

`npm audit fix`を実行してもBabelのバージョンは6のままでした。


インストール前から既にnode_modulesディレクトリが存在し、その中に古いBabelが存在していたためにBabel7が正常にインストールできなかったのかもと思い、node_modulesディレクトリの中のbabelと名がつくファイルやディレクトリ（babelifyディレクトリは除く）を全て削除し、再度Babel7をインストールするためのコマンドを実行しましたが、Babelのバージョンは6のまま変わっていませんでした。

改めて`npm auditの結果`の結果です。

（npm auditの結果）
```
───────────────┬──────────────────────────────────────────────────────────────┐
│ Low           │ Regular Expression Denial of Service                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ braces                                                       │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=2.3.1                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ babel-cli                                                    │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ babel-cli > chokidar > anymatch > micromatch > braces        │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/786                             │
└───────────────┴──────────────────────────────────────────────────────────────┘
```

今回も`npm audit fix`を実行してもBabelのバージョンは6のままで変わっていません。

関係がないかもしれませんが、今は全てデスクトップ上でBrowserifyを動かそうとしていますが、それよりも早い時期に`/usr/local/lib/node_modules/`にBabelをインストールしていますが、それはBabel7をデスクトップにインストールする上で関係ないと思ってもいいでしょうか。

##追記
（行ったこと）
・node_modulesディレクトリ（デスクトップ、/usr/local/libの2つとも）の削除
・Babel（本体＋コマンド）、browserifyの削除
・node.jsインストール
・Babelインストール（コマンドはグローバルインストール、本体はデスクトップにインストール）※コマンドインストール時にエラー発生、インストール自体は成功
・.babelrc作成
・browserifyグローバルインストール
・[このサイト](https://babeljs.io/docs/en/env/)を参考にコマンド`npm install @babel/preset-env`を実行

（Babelコマンドインストール時のエラー）
→文字数オーバーのため削除

###追記20191203
（package.json）　※場所：デスクトップ
```
{
  "name": "desktop",
  "version": "1.0.0",
  "description": "",
  "main": "sample.js",
  "dependencies": {
    "babel-loader": "^8.0.6",
    "babel-preset-es2015": "^6.24.1",
    "webpack": "^4.41.2"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

```
（.babelrc）　※場所：デスクトップ
```（{
    "presets": ["es2015"]
}）
```

###追記20191207
（package.json）※場所：デスクトップ
```
"dependencies": {},
"devDependencies": {
  "@babel/cli": "^7.7.4",
  "@babel/core": "^7.7.4",
  "@babel/preset-env": "^7.7.4",
  "babelify": "^10.0.0"
},
```

（.babelrc）　※場所：デスクトップ
```
// {
//     "presets": ["es2015"]
// }
{
    "presets": [
      [
        "@babel/preset-env",
        {
          "useBuiltIns": "entry"  // 任意
        }
      ]
    ]
  }
```

（browserifyコマンド実行時のエラー）
`Error: SyntaxError: Unexpected token : in JSON at position 14 while parsing json file /Users/north/Desktop/package.json
    at /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:550:30
    at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:61:3)

###追記20191208
（行ったこと）
・デスクトップ上のnode_modules と package-lock.json を削除
・「npm install」実行

（npm install実行時のエラー）
`
npm WARN desktop@1.0.0 No description
npm WARN desktop@1.0.0 No repository field.
up to date in 0.851sfound 0 vulnerabilities`

####20191214追記
（npx babelによるエラー）
```babel:
  stdin compilation requires either -f/--filename [filename] or --no-babelrc
```

####20191215追記
(package.json)
```
{
  "name": "desktop",
  "version": "1.0.0",
  "description": "",
  "main": "sample.js",
  "dependencies": {},
  "devDependencies": {
    "@babel/cli": "^7.7.4",
    "@babel/core": "^7.7.4",
    "@babel/preset-env": "^7.7.4",
    "babelify": "^10.0.0"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}
```
（エラーになるコマンド）

`browserify /Users/north/Desktop/sample.js /Users/north/Desktop/sample2.js -t [babelify --presets es2015] -o /Users/north/Desktop/sample4.js`

（上記のエラーのエラーメッセージ）
```
Error: .presets must be an array, or undefined while parsing file: /Users/north/Desktop/sample.js
    at assertArray (/Users/north/Desktop/node_modules/@babel/core/lib/config/validation/option-assertions.js:150:11)
    at assertPluginList (/Users/north/Desktop/node_modules/@babel/core/lib/config/validation/option-assertions.js:219:15)
    at /Users/north/Desktop/node_modules/@babel/core/lib/config/validation/options.js:107:5
    at Array.forEach (<anonymous>)
    at validateNested (/Users/north/Desktop/node_modules/@babel/core/lib/config/validation/options.js:83:21)
    at validate (/Users/north/Desktop/node_modules/@babel/core/lib/config/validation/options.js:74:10)
    at loadPrivatePartialConfig (/Users/north/Desktop/node_modules/@babel/core/lib/config/partial.js:66:50)
    at Object.loadPartialConfig (/Users/north/Desktop/node_modules/@babel/core/lib/config/partial.js:110:18)
    at transform (/Users/north/Desktop/node_modules/babelify/index.js:157:17)
    at BabelifyStream._flush (/Users/north/Desktop/node_modules/babelify/index.js:138:5)

```

Browserifyが実行できません

### 前提・実現したいこと
htmlで作成したフォーム(index.html)から入力した値を、
Node.jsで記述したPDF作成処理(createPdf.js)に渡したいと考えています。
(※js内でWebサーバーをたてています)

### 発生している問題・エラーメッセージ
普通に記述しただけでは「ReferenceError: require is not defined」というエラーが出るため、エラーの出ない方法を探しています。

Browserifyを使用したところrequireのエラーは消えましたが、
「TypeError: http.createServer is not a function」というエラーが出ます。

### 該当のソースコード
長い為、一部抜粋して掲載いたします。

```html
<!DOCTYPE html>
<html lang="ja">

<head>
    <meta http-equiv="content-type" charset="utf-8">
    <title>testページ</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="./bundle.js"></script>
</head>
<body>
    <form id="form1" name="form1">
　　<input type="text" name="q4_2_other" size="50">
　　<input type="submit" name="btn" id="btn" value="送　信"　onclick="createPdf()">
    </form>
    <script>
    $('#form1').submit(function(event) {
        var formData = $('form1').serialize();
        // ここでsubmitをキャンセルします。
        event.preventDefault();
        // Ajax処理
        $.ajax({
          url: 'http://localhost:8080/',
          type:'POST',
          dataType: 'json',
          data: formData,
          timeout:10000
        });
    });
    </script>
</body>
</html>
```
```javaScript
var PDFDocument = require('pdfkit');
var fs = require('fs');
var http = require("http"),
    url = require("url"),
    path = require("path"),
    port = process.argv[2] || 8080;

http.createServer(function(request, response) {
    var Response = {
        "200":function(file, filename){
            var extname = path.extname(filename);
            var header = {
                "Access-Control-Allow-Origin":"*",
                "Pragma": "no-cache",
                "Cache-Control" : "no-cache"
            }

            response.writeHead(200, header);
            response.write(file, "binary");
            response.end();
        },
        "404":function(){
            response.writeHead(404, {"Content-Type": "text/plain"});
            response.write("404 Not Found\n");
            response.end();

        },
        "500":function(err){
            response.writeHead(500, {"Content-Type": "text/plain"});
            response.write(err + "\n");
            response.end();

        }
    }


    var uri = url.parse(request.url).pathname
    , filename = path.join(process.cwd(), uri);

    fs.exists(filename, function(exists){
        console.log(filename+" "+exists);
        if (!exists) { Response["404"](); return ; }
        if (fs.statSync(filename).isDirectory()) { filename += './index.html'; }

        fs.readFile(filename, "binary", function(err, file){
        if (err) { Response["500"](err); return ; }
            Response["200"](file, filename);
        });

    });


}).listen(parseInt(port, 10));

console.log("Server running at http://localhost:" + port );
function createPdf(){

// 以降、pdf作成処理

}

```

### 補足情報（FW/ツールのバージョンなど）
browserify：ver.16.2.2
Node.js：v7.2.1


Webサーバーを立てた状態でrequireを使用できる方法をご存知の方、
ご教授宜しくお願い致します。

Javascriptのrequireを使いたい

Vue.jsを使ったクライアントサイドのアプリケーションを個人的に組んでいるのですが、最近諸々の機能追加をしたソースコードをHerokuへデプロイしようとしたところ、以下のエラーメッセージがgulpから出ました。
```
Cannot find module './comp/MyComponent.vue' from '/tmp/build_d491e7aeb055a2fa8d60a2b6bd7a2290/client/view/myapp/src/components/contents/
```

上記で`Cannot find module`となっているモジュールを参照しているVueファイル(App.vueとします)は、ローカルでは`/client/view/myapp/src/components/contents/`に配置してあります。

App.vue内で`import MyComp from './comp/MyComponent.vue'`として利用しようとしているのですが、そこで見つからないとしてエラーにされてしまっているようです。

ローカルでも試してみたのですが、ローカルでは何の問題もなくビルドが成功してしまうため、手がかりをつかめずにいます。
リポジトリから再クローンしてからビルドを実行してみたのですが、やはりローカルでは成功してしまいます。

Heroku上でのみビルドが失敗する原因について、何か心当たりが有る方ご教授いただけないでしょうか。
開発環境はMacOSです。

以下にpackage.json、gulpfile.jsのビルドに関する部分の抜粋、gulpfileが参照しているjson、bower.jsonを記載します。
Herokuおよびローカルで試したコマンドはいずれも`npm run build`です。

###package.json

```
{
  "name": "myapp",
  "version": "0.1.0",
  "description": "A Vue.js project",
  "author": "",
  "private": true,
  "scripts": {
    "postinstall": "bower install && npm run build",
    "watchify": "gulp watchify --env=$NODE_ENV --api=$API_URL",
    "lint:vue": "gulp lint:vue",
    "test": "karma start karma.conf.js",
    "build": "gulp build --env=$NODE_ENV --api=$API_URL",
    "gulp": "gulp --env=$NODE_ENV --api=$API_URL"
  },
  "browserify": {
    "transform": [
      "babelify",
      "debowerify",
      "vueify"
    ]
  },
  "browser": {
    "vue": "vue/dist/vue.common"
  },
  "dependencies": {
    "axios": "^0.15.3",
    "babel-core": "^6.0.0",
    "babel-plugin-transform-inline-environment-variables": "^6.8.0",
    "babel-plugin-transform-object-rest-spread": "^6.20.2",
    "babel-plugin-transform-runtime": "^6.0.0",
    "babel-preset-es2015": "^6.0.0",
    "babel-preset-stage-2": "^6.0.0",
    "babel-runtime": "^6.0.0",
    "babelify": "^7.2.0",
    "bootstrap-sass": "^3.3.7",
    "bower": "^1.8.0",
    "browserify": "^13.1.0",
    "browserify-hmr": "^0.3.1",
    "cross-env": "^2.0.0",
    "css-loader": "^0.26.1",
    "debowerify": "^1.5.0",
    "envify": "^3.4.1",
    "express": "^4.14.0",
    "gentelella": "^1.3.0",
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^3.1.1",
    "gulp-env": "^0.4.0",
    "gulp-envify": "^1.0.0",
    "gulp-sass": "^2.3.2",
    "gulp-sourcemaps": "^2.2.0",
    "gulp-uglify": "^2.0.0",
    "gulp-util": "^3.0.8",
    "gulp-vueify": "0.0.3",
    "gulp-webserver": "^0.9.1",
    "marked": "^0.3.6",
    "minimist": "^1.2.0",
    "moment": "^2.17.1",
    "node-sass": "^3.13.1",
    "uglify-js": "^2.5.0",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "vue": "^2.1.6",
    "vue-datepicker": "https://github.com/hilongjw/vue-datepicker.git",
    "vue-indicator": "0.0.7",
    "vue-resource": "^1.0.3",
    "vue-router": "^2.0.1",
    "vue-template-compiler": "^2.1.6",
    "vue2-timepicker": "^0.1.4",
    "vueify": "^9.4.0",
    "vuex": "^2.1.1"
  },
  "devDependencies": {
    "babel-eslint": "^7.1.1",
    "eslint": "^3.3.0",
    "eslint-config-standard": "^5.3.5",
    "eslint-config-vue": "^2.0.1",
    "eslint-plugin-html": "^1.5.2",
    "eslint-plugin-promise": "^2.0.1",
    "eslint-plugin-standard": "^2.0.0",
    "eslint-plugin-vue": "^1.0.0",
    "gulp-eslint": "^3.0.1",
    "gulp-plumber": "^1.1.0",
    "jasmine-core": "^2.4.1",
    "karma": "^1.2.0",
    "karma-browserify": "^5.1.0",
    "karma-jasmine": "^1.0.2",
    "karma-phantomjs-launcher": "^1.0.0",
    "karma-spec-reporter": "0.0.26",
    "npm-run-all": "^2.3.0",
    "phantomjs-prebuilt": "^2.1.3",
    "proxyquireify": "^3.0.1",
    "watchify": "^3.4.0"
  }
}

```

###gulpfile.js
gulpfileではminimistを使って、引数のenvとapiをargvという変数に格納しています。
```javascript
// 本番環境とローカル環境で、APIコールの向き先を変えている

var path = {
  vue: (app) => {
    return {
      src: `./client/view/${app}/src/main.js`,
      out: `./public/${app}/`
    };
  }
};
require('gulp-env')({
  vars: {
    NODE_ENV: argv.env || 'development',
    API_URL: argv.api || 'http://localhost:8080'
  }
});

var isProduction = argv.env === 'production';

gulp.task('build', [
  'build:vue',
  'build:sass',   // sassファイルのコンパイル
  'build:static'  // 画像やhtmlを公開フォルダにコピー
]);

gulp.task('build:vue', () => {
  // 公開ページと管理ページ等、複数のシングルページ用ソースをまとめてビルドする。
  // applicationsに入っているのは、各アプリ名となる文字列
  applications.forEach(function(app) {
    console.log(`build:vue:${app}`);
    rebuild(app, false);
  });
});

function rebuild(app, isWatch) {
  var browserify = require('browserify'),
      source = require('vinyl-source-stream'),
      uglify = require('gulp-uglify'),
      buffer = require('vinyl-buffer'),
      vuePath = path.vue(app), // 各アプリのパスを取得
      browserifyHmr = require('browserify-hmr'),
      b = browserify(vuePath.src, {
        paths: require('./.localmodules.json')
      });

  if(!isProduction && isWatch) {
    // watchifyは開発環境でしか使わない + インストールしない
    const watchify = require('watchify');
    b = watchify(b).plugin(browserifyHmr);
  }

  b.plugin('vueify/plugins/extract-css', { out: vuePath.out + 'build.css' })
  .on('update', () => {
    exec();
  })
  .on('error', (e) => {
    console.log(e);
  })
  .on('log', (message) => {
    console.log(message);
  });

  return exec();

  function exec(bundler) {
    if(!isProduction) {
      eslint(app); // lintチェック
    }

    (() => {
      if(!isProduction && isWatch) {
        var plumber = require('gulp-plumber');
        return b.bundle().pipe(plumber(plumberConfig(`build:vue:${app}`)));
      }
      return b.bundle();
    })().on('error', (e) => {
      util.log(util.colors.red('[Error][bundle]'), e.message);
      util.log(util.colors.red('[Error][bundle]'), e);
    })
    .pipe(source('build.js'))
    .pipe(buffer())
    .pipe(sourcemap.init())
    .pipe(uglify().on('error', function(err) {
      util.log(util.colors.red('[Error][uglify]'), err.message);
      this.emit('end');
    }))
    .pipe(sourcemap.write())
    .pipe(gulp.dest(vuePath.out));
  }
}
```

###.localmodules.json

```
[
  "./node_modules",
  "./bower_components",
  "./client"
]
```

###bower.json

```
{
  "name": "myapp",
  "description": "",
  "main": "",
  "license": "MIT",
  "homepage": "",
  "private": true,
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "AdminLTE": "admin-lte#^2.3.11",
    "summernote": "^0.8.2",
    "jquery": "^3.1.1"
  }
}

```

Herokuへのデプロイ時、browserifyでCan not find module となって失敗する

### 前提・実現したいこと

現在`gulp`及び`browsify`を利用している、`vue.js`プロジェクトに`Bootstrap-vue`を導入したところですが、以下警告が表示され困っています。
公式サイトやGitHubなどを見て解決を試みたのですが、解決できませんでしたので、お力添えをいただければ非常に助かります!

### 発生している問題・エラーメッセージ

```
[BootstrapVue warn]: Multiple instances of Vue detected!
You may need to set up an alias for Vue in your bundler config.
See: https://bootstrap-vue.org/docs#using-module-bundlers

vue.runtime.common.dev.js:621 
```

```
You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html
VM43:146 serviceWorker registed.

vue.common.dev.js:9054
```

```
You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html

vue.runtime.common.dev.js:8406
```

### 原因

Bootstrap-vueの公式サイトに書いてある、[Aliasing Vue import](https://bootstrap-vue.org/docs)が原因だと思います。

> If you are using a specific build of Vue (i.e. runtime-only vs. compiler + runtime), you will need to set up an alias to 'vue' in your bundler config to ensure that your project, BootstrapVue and PortalVue are all using the same build version of Vue. If you are seeing an error such as "$attr and $listeners is readonly", or "Multiple instances of Vue detected", then you will need to set up an alias.

こちらを見るに、Bootstrap-vueの内部的に `reqire 'vue'`とvueを呼び出していますが、この呼び出しているvueがBootstrap-vueでは、 `vue.runtime.common.js`　であるのに対し、プロジェクトで参照しているのは`vue.common.js`であるため、２つのvueインスタンスが見つかり、エラーが起こっているようです。


### 試したこと

公式サイトに書いてあるように `import Vue from 'vue'`や`require 'vue'`とした時に`vue.common.js`を共通的に見に行ってほしいのですが、どうにもうまくいきません。

バンドラーに`webpack`を利用している場合、以下のように記載すれば解決するようですが、プロジェクトの都合で`browesify`を利用する制限があります。

```js
// webpackの場合
module.exports = {
  // ...
  resolve: {
    alias: {
      // If using the runtime only build
      vue$: 'vue/dist/vue.runtime.esm.js' // 'vue/dist/vue.runtime.common.js' for webpack 1
      // Or if using full build of Vue (runtime + compiler)
      // vue$: 'vue/dist/vue.esm.js'      // 'vue/dist/vue.common.js' for webpack 1
    }
  }
}
```

[vue.jsの公式サイト][https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only]を参考にしながら、`package.json`に以下のように記載したのですが、エラー内容も変わらず、複数のvueインスタンスが生成されてしまっているようです。

```json
{
  // ...
  "browser": {
    "vue": "vue/dist/vue.common.js"
  }
}
```

また、Bootstrap-vueのGitHubの[issue](https://github.com/bootstrap-vue/bootstrap-vue/issues/3351#issuecomment-495936581)を見てBootstrapVueの呼び出し方を変えて見ましたが、これまたエラー内容に変わり有りませんでした。

```js
// import Vue from 'vue'
// import BootstrapVue from 'bootsrap-vue'
// Vue.use(BootstrapVue)
// ↑こちらとエラー内容に変わりなし
Vue.use(require('bootstrap-vue/dist/bootstrap-vue.common.min'));
```

### 補足情報（FW/ツールのバージョンなど）

vue: 2.6.10
bootstrap-vue: 2.15.0

色々試したのですが、万策尽きたという感じです。
もし似たような問題を見たことがある、解決したことがあるという方はご意見をお聞かせください