example of use?

[lucked]

hi can u show example of use this libary?

[markmcdowell]

Hi sure, we're using storybook so all the examples of Stories are here: https://github.com/reactivemarkets/react-financial-charts/tree/master/packages/stories/src

GitHub

reactivemarkets/react-financial-charts

Charts dedicated to finance. Contribute to reactivemarkets/react-financial-charts development by creating an account on GitHub.

[lucked]

i got this error SyntaxError: Unexpected token 'export' (anonymous function) /Users/lucasrodrigues/Downloads/next-boilerplate-master/node_modules/react-financial-charts/lib/index.js:1

im using typescript

[lucked]

export { ChartCanvas } from "./ChartCanvas"; ^^^^^^

SyntaxError: Unexpected token 'export'

[markmcdowell]

The library is built with es6, I expect your tsconfig settings are targeting a lower version.

[lucked]

this is my tsconfig im using nexjs for render.

{ "compilerOptions": { "target": "es2017", "lib": [ "dom", "dom.iterable", "esnext" ], "allowJs": true, "skipLibCheck": true, "strict": true, "forceConsistentCasingInFileNames": true, "noEmit": true, "noImplicitAny": false, "esModuleInterop": true, "module": "esnext", "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", "baseUrl": ".", "paths": { "@Actions": [ "src/Actions" ], "@Components/": [ "src/Components/" ], "@Components": [ "src/Components" ], "@Definitions/": [ "src/Definitions/" ], "@Definitions": [ "src/Definitions" ], "@Interfaces": [ "src/Interfaces" ], "@Interfaces/": [ "src/Interfaces/" ], "@Pages/": [ "pages/" ], "@Reducers": [ "src/Redux/Reducers" ], "@Reducers/": [ "src/Redux/Reducers/" ], "@Redux": [ "src/Redux" ], "@Redux/": [ "src/Redux/" ], "@Server/": [ "server/" ], "@Services": [ "src/Services" ], "@Services/": [ "src/Services/" ], "@Static/": [ "static/" ], "@Styled/": [ "src/Styled/" ], "@Test/": [ "test/" ] } }, "exclude": [ "node_modules", "typings", "dist", ".next", "out", "next.config.js", ".babelrc", "bundles", "coverage", "test/*" ], "include": [ "next-env.d.ts", "*/.ts", "*/.tsx" ] }

[markmcdowell]

I see, yes your tsconfig is fine and compiles if you use that directly. It seems next.js is the issue here: https://github.com/zeit/next.js/issues/706

[lucked]

im trying but nothing at now... all of other components works fine . const withPlugins = require("next-compose-plugins"); const withCSS = require("@zeit/next-css"); const withSass = require("@zeit/next-sass"); const withBundleAnalyzer = require("@zeit/next-bundle-analyzer"); const nextRuntimeDotenv = require("next-runtime-dotenv");

const withConfig = nextRuntimeDotenv({ public: ["API_URL", "API_KEY"] });

const nextConfig = { analyzeServer: ["server", "both"].includes(process.env.BUNDLE_ANALYZE), analyzeBrowser: ["browser", "both"].includes(process.env.BUNDLE_ANALYZE), bundleAnalyzerConfig: { server: { analyzerMode: "static", reportFilename: "../bundles/server.html", }, browser: { analyzerMode: "static", reportFilename: "../bundles/client.html", }, }, publicRuntimeConfig: { PROXY_MODE: process.env.PROXY_MODE, API_URL: process.env.API_URL, API_KEY: process.env.API_KEY, STATIC_PATH: process.env.STATIC_PATH, }, };

module.exports = withConfig( withPlugins([[withCSS], [withSass], [withBundleAnalyzer]], nextConfig) );

[lucked]

mext config file

[lucked]

SOLUTION : const withTM = require('next-transpile-modules')(['react-financial-charts']); module.exports = withConfig( withPlugins([[withTM]], nextConfig) ); on my next config file . thanks sir

[markmcdowell]

Great! 👍

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.