2016-01-10 14 views
9

W mojej poprzedniej aplikacji Meteor, używając trybu przeglądania i Reakcji, wszystko działało, dopóki nie przełączyłem się na meteor webpack.W jaki sposób zapobiec pobieraniu wielu kopii z React?

używam react-select w moich meteorów aplikacji i to działało świetnie, ale z browserify mogę zapobiec wielu kopii reagują z załadunkiem, który zapobiega ten błąd mam teraz ma:

Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's render method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

Moja package.json wyglądać ten :

... 

"dependencies": { 
    "classnames": "^2.1.3", 
    "lodash": "^3.10.0", 
    "react": "^0.14.6", 
    "react-dom": "^0.14.6", 
    "react-mixin": "^2.0.1", 
    "react-select": "^1.0.0-beta8" 
    }, 

... 

Czy istnieje konfiguracja w pakiecie sieci Web mogę użyć czegoś zewnętrznego externals? Nie do końca pewny, co to znaczy, ale komentarz powiedział używać:

externals: { 
    'react': 'React', 
    'react-dom': 'ReactDOM' 
} 
+0

Wygląda na to, że zastosowano wiele wersji reakcji. stackoverflow.com/questions/34236426/how-to-fix-react-error-uncaught-error-avvantant-violation-addcomponentasrefto/34358537#34358537 – Manivannan

Odpowiedz

5

Ponieważ używasz WebPACK można dodać alias do załadunku reagują tak:

// In webpack.config.js 

    resolve: { 
    alias: { 
     react: path.resolve('node_modules/react'), 
    }, 
    }, 

ten uniemożliwił błąd addComponentAsRefTo(...) i sprawił, że nasza budowa znów się powiedzie. Jednak z jakiegoś powodu kompilacja testowa nie powiodła się tylko w naszym środowisku CI, ponieważ nie mogła rozwiązać ścieżki node_modules/react. Myślę, że jest mało prawdopodobne, że spotkasz się z tym konkretnym problemem.

+1

To rozwiązanie mnie uratowało! Dziękuję Ci. – JoshJ

1

Coś który pracował dla mnie było:

Odinstaluj wszystkie zainstalowane globalnie pakiety związane reagować (tworzenie reagują-app, reagują-rodzimy, reagują i tak dalej)

następnie: rm -rf node_modules

następnie: użyj npm install zamiast przędzy zainstalować

rozważa App stworzony z paka reagują-app i wyrzucany

0

W moim przypadku budowałem osobny moduł npm, a następnie dodawałem go jako bibliotekę w innym projekcie lokalnie używając npm link ../some-library. Jeden z modułów w tej bibliotece spowodował ten błąd podczas uruchamiania projektu nadrzędnego.

Po napotkaniu tego błędu, rozwiązaniem dla mnie było uniemożliwienie reagowania i reakcji-dom z dołączania do zbioru niektórych bibliotek, przez dodanie następujących elementów do modułu.exports jego pliku webpack.config.js :

externals: { 
    react: 'react', 
    'react-dom': 'react-dom' 
} 
Powiązane problemy