Как я могу исключить "require (" реагировать ") из моего обозреваемого пакета?

Я использую Browserify для объединения приложения ReactJS.

Все мои компоненты включают require("react") вверху. Это приводит к тому, что Browserify включает источник ReactJS в мой пакет. Но я хотел бы исключить его.

Как мне это сделать? Правильно ли это делать?

Ответ 1

@NickTomlin дал этот ответ, но затем удалил его.

Вы можете использовать external:

browserify --external react src.js > dest.js

Пример с использованием api:

var bundler = browserify('src.js');

bundler.external('react');
bundler.bundle();

Это жизнеспособный вариант. external требуется другой script, чтобы обеспечить модуль совместимым образом. Вы можете создать такой script следующим образом:

browserify -r react > react.js
env NODE_ENV=production browserify -r react | uglifyjs -m > react.min.js

И в HTML:

<script src="react.js"></script>
<script src="dest.js"></script>

dest.js - это ваш код, за исключением реакции. response.js просто реагирует и его зависимости.

Нужно больше вещей внешнего? Просто добавьте их в дополнение к реакции.

browserify -x react -x react-bootstrap src.js > dest.js
browserify -r react -r react-bootstrap > vendor.js

Вы также можете сделать что-то подобное в package.json

"browser": {"react": "./react-fake.js"}

// ./react-fake.js
try {
    module.exports = require('react');
} catch(e){
    module.exports = window.React;
}

И скомпилируйте с помощью -x react. Это позволяет вам принять сборку -r react и вернуться к глобальному React.

Ответ 2

Похоже, вы хотите использовать browserify-shim.

В package.json

"browserify-shim": {
    "react": "global:React"
},
"browserify": {
    "transform": [ "browserify-shim" ]
},
"dependencies": {
    "browserify-shim": "~3.2.0"
}

(непроверенные). Этот раздел содержит дополнительную информацию.

Ответ 3

Я также хотел это сделать и нашел возможное решение.

Из справки browserify -h:

- игнорировать, -i Заменить файл пустым заглушкой. Файлы могут быть глобальными.

Просто используйте функцию игнорировать.

browserify -i react -i react-dom ...

Я также добавил реагировать и реагировать как равноправные зависимости, потому что в моем случае пакет можно импортировать в другие сборки пакетов.

Ответ 4

Вы также можете использовать раздел externals в файле webpack.config.js. например: -

externals: {
        // require('jquery') is loaded externally and avaliable as jQuery
        "jquery": "jQuery"
    }

См. https://webpack.github.io/docs/library-and-externals.html