Closed RahavLussato closed 8 years ago
npm install https://github.com/esbullington/react-d3
i still get errors with this version: "Module parse failed: .../node_modules/react-d3/src/barchart/BarChart.jsx Unexpected token (107:6) You may need an appropriate loader to handle this file type."
@RahavLussato You will need to compile the react-d3 jsx files to js. If you are using a transpiler, you are probably excluding node_modules from transpilation.
Simple fix: include node_modules in the transpiler toolchain. The build will take longer. You may be able to refine the build to include node_modules/react-d3 while excluding the rest of node_modules.
@johnsoftek thanks
I'm running into a similar issue trying to use https://github.com/esbullington/react-d3 from a project laid out like https://github.com/gaearon/react-hot-loader.
I don't understand how to configure webpack/babel to deal with the jsx transpiling, and so on start of the server, I get:
ERROR in ./~/react-d3/src/barchart/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./BarChart in /Users/dascher1/src/react-hot-boilerplate/node_modules/react-d3/src/barchart
@ ./~/react-d3/src/barchart/index.js 5:19-40
ERROR in ./~/react-d3/src/linechart/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ./LineChart in /Users/dascher1/src/react-hot-boilerplate/node_modules/react-d3/src/linechart
@ ./~/react-d3/src/linechart/index.js 5:20-42
and the like.
Which makes sense, as the default .babelrc
config in that repo doesn't do JSX, but just adding babel-plugin-transform-react-jsx
to the .babelrc
and npm install
ing it doesn't fix it.
Any advice?
@davidascher i ended up with download the package and put it inside "lib" library that will be included to babel-loader.
Hi thanks for the issue. I decided to maintain this at my own repo since I don't have permission to update package on npm.
Now you can get the latest version (0.5.2) via
npm install rd3
Here is the repo -> https://github.com/yang-wei/rd3
Later I will update the README on this repository to let folks know maintained repository.
If anyone is still interested in installing from GitHub...
My webpack config: (note that I have removed node_modules
from module.loaders.exclude
var path = require('path')
var webpack = require('webpack')
module.exports = {
devtool: 'cheap-module-eval-source-map',
entry: [
'webpack-hot-middleware/client',
'./src/index'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/static/'
},
resolve: {
root: path.join(__dirname, 'src'),
extensions: ['', '.js', '.jsx']
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
],
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(bower_components)/,
loaders: ['babel']
}
],
plugins: [
new webpack.DefinePlugin({
'process.env': { NODE_ENV: JSON.stringify(process.env.NODE_ENV || 'development') }
})
]
}
}
.babelrc
"presets": ["react", "es2015"],
"env": {
"development": {
"presets": ["react-hmre"]
}
}
}
package.json
{
"name": "myapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node server.js",
"build": "NODE_ENV=production node node_modules/.bin/webpack"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"babel-polyfill": "^6.6.1",
"immutable": "^3.7.6",
"moment": "^2.12.0",
"react": "^0.14.7",
"react-d3": "git+https://github.com/esbullington/react-d3.git",
"react-dom": "^0.14.7",
"react-redux": "^4.4.1",
"redux": "^3.3.1",
"redux-thunk": "^1.0.3",
"reselect": "^2.2.1"
},
"devDependencies": {
"babel-core": "^6.6.5",
"babel-loader": "^6.2.4",
"babel-preset-es2015": "^6.5.0",
"babel-preset-react": "^6.5.0",
"babel-preset-react-hmre": "^1.1.1",
"babel-register": "^6.6.5",
"express": "^4.13.4",
"faucet": "0.0.1",
"flow-bin": "^0.22.1",
"tape": "^4.4.0",
"webpack": "^1.12.14",
"webpack-dev-middleware": "^1.5.1",
"webpack-hot-middleware": "^2.9.1"
}
}
@johnsoftek I publish the latest version which will fix this problem at rd3.
Feel free to npm install rd3
and you can remove those hack for faster webpack build =)
when i tried to install the package from master branch i got "Module parse failed" errors, so how i can get the latest changes (include tooltips) ? when i do npm install react-d3 i get 0.4.0 version.