反応-LDSの中にインポートの追加失敗したコンパイル

Question

で結果コンポーネントを反応させ、私はこの行をコメント場合error.Itはいかなる問題なくコンパイルの原因となっているインポートを参照してください。

import React, {Component} from 'react'; 
import {returnCurrencies} from '../reducers/reducer_currency'; 
import {DropdownMenu, DropdownMenuList, DropdownMenuListItem} from 'react-lds'; 

export default class CurrencyDropDown extends Component 
{ 
    constructor(props) 
    { 
     super(props); 
     //console.log("props",props); 
    } 
    renderCurrencies(curr) 
    { 
     //console.log("Curr ", curr); 
     return (<option key={curr} value={curr}>{curr}</option>); 
    } 
    render() 
    { 
     if(!this.props.currencies) 
     { 
     return (<div></div>); 
     } 
     let currencyList = returnCurrencies(this.props.currencies); 
     return (<div> 
      <select value={this.props.initValue} onChange= 
       {this.props.selectCurrency}> 
      {currencyList.map(this.renderCurrencies)} 
      </select> 
     </div>); 
} 
} 

Package.json

{ 
    "name": "redux-simple-starter", 
    "version": "1.0.0", 
    "description": "Simple starter package for Redux with React and Babel support", 
    "main": "index.js", 
    "repository": "", 
    "scripts": { 
     "start": "node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js", 
     "test": "mocha --compilers js:babel-core/register --require ./test/test_helper.js --recursive ./test", 
     "test:watch": "npm run test -- --watch" 
}, 
"author": "", 
"license": "ISC", 
"devDependencies": { 
"babel-core": "^6.2.1", 
"babel-loader": "^6.2.0", 
"babel-preset-es2015": "^6.1.18", 
"babel-preset-react": "^6.1.18", 
"chai": "^3.5.0", 
"chai-jquery": "^2.0.0", 
"jquery": "^2.2.1", 
"jsdom": "^8.1.0", 
"mocha": "^2.4.5", 
"react-addons-test-utils": "^0.14.7", 
"webpack": "^1.12.9", 
"webpack-dev-server": "^1.14.0" 
}, 
"dependencies": { 
"axios": "^0.16.2", 
"babel-preset-stage-1": "^6.1.18", 
"lodash": "^3.10.1", 
"prop-types": "^15.5.10", 
"react": "^0.14.9", 
"react-dom": "^0.14.9", 
"react-lds": "^1.1.11", 
"react-redux": "4.3.0", 
"react-router": "^2.0.1", 
"redux": "^3.0.4", 
"redux-promise": "^0.5.3" 
} 

}

以下のエラーでコンパイルできませんでした。

./~/moment-timezone/data/packed/latest.json モジュールでERROR失敗パース：Cを：.. \ XXXX \ node_modules \瞬間、タイムゾーン\データ\パック\ latest.json予期しないトークンを（2 ：10） あなたはこのファイルタイプを処理するために、適切なローダーが必要な場合があります。 SyntaxError：Parser.pp $ 4.raise（予期せぬトークン（2:10） ）Parser.ppの にある、予期しないトークン（2:10）予期しない（C：.. \ XXXX \ node_modules \ WebPACKの\ node_modules \ドングリ\ distの\ acorn.js：603：10）Parser.pp.semicolonで を（C：.. \ XXXX \ node_modules \ WebPACKの\ node_modules \ドングリ\ Parser.pp $ 1.parseExpressionStatement（C：¥XXXX¥node_modules¥webpack¥node_modules¥acorn¥dist¥acorn.js：966：10） at Parser.pp $ 1 .parseStatement（C：.. \ XXXX \ node_modules \ WebPACKの\ node_modules \ドングリ\ distの\ acorn.js：730：24） をParser.pp $ 1.parseBlock（Cで：.. \ XXXX \ node_modules \ WebPACKの\ node_modules \ acorn \ dist \ acorn.js：981：25） at Parser.pp $ 1.parseStatement（C：.. \ XXXX \ node_modules \ webpack \ node_modules \ acorn \ dist \ acorn.js：70 Parser.parse（C：.. \ XXXX \ node_modules \ webpack \ node_modules \ acorn \ dist \ acorn.js：638：25） at Parser.parse（C：.. XXXX （C：.. \ XXXX \ node_modules \ webpack \ node_modules \ acorn \ dist \ acorn.js：3098：39）にある\ node_modules \ webpack \ node_modules \ acorn \ dist \ acorn.js：516：17） @ ./~/moment-timezone/index.js 2：15-51

Answer 1

JSONファイルをロードできないため失敗します。あなたは、JSONファイルをロードするためのWebPACKを設定する必要があります。

json-loaderをインストールします。

npm install --save-dev json-loader 

そして、このようなものを使用するようにWebPACKのコンフィグローダーセクションを調整します

rules: [ 
    ... 
    { 
    test: /\.json$/, 
    use: 'json-loader' 
    } 
    ... 
] 

あなたがいることを考えるとwebpack v1の設定を使って少し違って見えるかもしれません。