Grunt browserify терпит неудачу при требовании реакции-bootstrap-typeahead

Question

Я пытаюсь включить https://www.npmjs.com/package/react-bootstrap-typeahead в мой проект, но когда я запускаю свою грубую задачу browserify, я получаю ParseError: Unexpected token ошибка. Полное сообщение здесь:

Running "browserify:dist" (browserify) task
>> /path/to/project/node_modules/react-bootstrap-typeahead/css/Typeahead.css:1
>> .bootstrap-typeahead .dropdown-menu {
>> ^
>> ParseError: Unexpected token
Warning: Error running grunt-browserify. Use --force to continue.

Aborted due to warnings.

Проблема в том, что есть require('/some/file.css') внутри исходного источника типа реакции-бутстрапа js.

Вот моя главная задача:

    browserify: {
        dist: {
            cwd: 'build',
            options: {
                transform : ['browserify-css'],
                alias: {
                    'index' : './dist/index.js',
                    'root' : './dist/containers/root.js',
                    'designs' : './dist/components/designs.js',
                    'addMutationForm' : './dist/components/addMutationForm.js',
                    'ProteinChecker': './dist/containers/ProteinChecker.js',
                    'configureStore': './dist/configureStore.js',
                    'actions' : './dist/actions.js',
                    'reducers' : './dist/reducers.js',
                    'utils': './dist/utils.js',
                },
                require: [
                    './node_modules/isomorphic-fetch',
                    './node_modules/jquery',
                    './node_modules/react',
                    './node_modules/react-dom',
                    './node_modules/bootstrap',
                    './node_modules/redux',
                    './node_modules/babel-polyfill',
                    './node_modules/redux-logger',
                    './node_modules/redux-thunk',
                    './node_modules/underscore',
                    './node_modules/redux-form',
                    './node_modules/react-bootstrap-typeahead'
                ]
            },
            src: ['./dist/*.js', './dist/*/*.js'],
            dest: './public/build/app.js'
        }
    }

Несколько вещей, с которыми я столкнулся, пытаясь решить проблему: похожий вопрос SO (пока без ответа), но с использованием веб-пакета, а не grunt + browserify, поэтому я не верю в применимость: использование response-bootstrap-typeahead, генерирующего ошибки CSS, и закрытая проблема на странице github проекта response-bootstrap-typeahead, но не затрагивает использование через grunt: https://github.com/ericgio/react-bootstrap-typeahead/issues/2 котором предлагается использовать преобразование browserify-css.

Я пытался получить грубость, чтобы использовать это преобразование, добавив transform : ['browserify-css'] в поле параметров, но это не сработало. Я все еще получаю точно такое же сообщение об ошибке.

Я попытался использовать browserify с преобразованием browserify-css в командной строке, чтобы связать только одну эту библиотеку, а затем включить этот комплект, но это приводит к еще большему количеству ошибок в будущем, что, как я считаю, связано с относительным импортом (и я не думаю, что это хорошее решение в любом случае, потому что, если я правильно понимаю browserify, оно в конечном итоге будет включать такие вещи, как реакцию дважды: один раз для пакета typeahead, который я создал в командной строке, и снова для фактического пакета приложения, а затем финальный JS файл огромен!).

Любые идеи о том, как я могу решить эту проблему?

Заранее спасибо!

Answer 1

Таким образом, решение оказывается добавить

"browserify": {
    "transform": ["browserify-css"]
}

к пакетам.json типа response-bootstrap-typeahead. Это было в документах browserify-css... (facepalm)