import css from node_modules in meteor 1.4 с реакцией

Я хочу использовать пакет npm, а именно react-date-picker в моем проекте Meteor 1.4 с использованием React. Пакет react-date-picker поставляется с некоторыми css, которые должны быть включены для правильного отображения. Мне нужно сообщить метеору, чтобы загрузить node_modules/react-date-picker/index.css и включить его с остальной частью его css, но я не понимаю, как это сделать. Другие предположили, что вы можете просто импортировать CSS внутри .jsx компонента, как этотimport css from node_modules in meteor 1.4 с реакцией

import 'react-date-picker/index.css'

но делать это приводит к сбой сервера, который задыхается на первой линии CSS (как это, кажется, анализируются как стандарт файл JavaScript)

(function (exports, require, module, __filename, __dirname) { .react-date-field { 
                  ^
) SyntaxError: Unexpected token . 
    at exports.runInThisContext (vm.js:53:16) 
    at Module._compile (module.js:373:25) 
    at Object.Module._extensions..js (module.js:416:10) 
    at Module.load (module.js:343:32) 
    at Module.Mp.load (/Users/gsferrer/.meteor/packages/babel-compiler/.6.9.1.7f3rvr++os+web.browser+web.cordova/npm/node_modules/reify/node/runtime.js:16:23) 
    at Function.Module._load (module.js:300:12) 
    at Module.require (module.js:353:17) 
    at require (internal/module.js:12:17) 
    at npmRequire (/Users/gsferrer/Projects/xxx/.meteor/local/build/programs/server/npm-require.js:129:10) 
    at Module.Mp.useNode (packages/modules-runtime/modules-runtime.js:69:1) 
=> Exited with code: 1 
=> Your application is crashing. Waiting for file change.

так что является предпочтительным способом для импорта CSS из node_modules использования Meteor с Реагировать?

источник

2016-10-03 Greg Ferreri

Как вы говорите, он, по-видимому, анализируется как JS. Тем не менее, импорт CSS таким образом является правильным и обычно работает, поэтому должно произойти что-то странное. Поэтому я собираюсь попробовать дикое предположение: попробуйте переименовать файл с index.css на что-то еще, например . Возможно, что имя «индекса» вызывает интерпретацию JS.

источник

2016-10-03 19:26:42

Нету, он все еще жалуется, независимо от имени CSS. Я переключился на пакет «response-datetime», чей css-файл «response-datetime».css', но такая же ошибка возникает. –

Я тоже долго простаивал по этому вопросу (я новичок в мире node.js/Meteor/React/JavaScript). Мне нужно импортировать файл CSS в node_modules/реагировать-DataGrid/index.css

Мой рабочий раствор (применяется к крошечному приложение, которое должно сделать его легко понять, я только отобразить DataGrid с помощью жестко закодированных данных) доступен на моем GitHub repository (совершить 902c92c). Приложение называется «reactDataGrid», это подпапка репозитория, вам просто нужно запустить «метеорит» в этой папке.

Основные шаги в моем случае были:

npm install webpack --save-dev установить веб-пакет для проекта
создать файл .babelrc с содержанием описано here (и скопировал ниже). Я считаю, что это помогает webpack проанализировать синтаксис JSX.

.babelrc

{ 
    "presets": [ 
    [ 
     "es2015", 
     { 
     "modules": false 
     } 
    ], 
    "react" 
    ] 
}

добавить require('react-datagrid/index.css') заявление в моем клиент/main.jsx файл, который говорит, Webpack включить этот файл CSS в дереве зависимостей моего приложения. Это на самом деле инструкция, описанная в README репозитория GitHub zippyui/response-datagrid. (К сожалению StackOverflow пределы двух звеньев в моем посте, так что я не могу связать его здесь больше)

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

Бест, Кевин

источник

2017-01-29 15:20:02 kevinrue

import css from node_modules in meteor 1.4 с реакцией

ответ

Смежные вопросы