shellyln / chart.js-node-ssr-example

Chart.js server side rendering example. (pure JavaScript; no native modules)
https://www.npmjs.com/package/red-agate-svg-canvas
Other
48 stars 8 forks source link

Run in node without webpack ? #3

Open cameronbraid opened 4 years ago

cameronbraid commented 4 years ago

Is there any way to run this in node without using webpack ?

shellyln commented 4 years ago

If you use Node>=13.0.0, webpack is reqired.
On 10<=Node<13, it is possible to run w/o webpack. (but not recommended)

index.ts

import { SvgCanvas,
         SvgCanvas2DGradient } from 'red-agate-svg-canvas/modules';

// NOTE: hack bad .d.ts definition for ESM.
import * as ChartJs_ from 'chart.js';
const ChartJs: typeof ChartJs_ = (ChartJs_ as any).default || ChartJs_;

See also: https://github.com/shellyln/mdne/blob/12f7e4d9a54d991f55390cdf0d8c8f806fad4e60/package.json#L49-L50 https://github.com/shellyln/menneu/blob/master/src/components/Chart.tsx https://github.com/shellyln/menneu/blob/master/package.json

cameronbraid commented 4 years ago

I found an easy way - install esm and ts-node

https://github.com/cameronbraid/chart.js-node-ssr-example/commit/f987196d0eabe00ee13c10811f8b45394d768071

to see it working, checkout my branch :

npm install
npm run run
shellyln commented 4 years ago

Hi, @cameronbraid .
Thanks for your useful information.
I think it's a very good way to get started this example w/o webpack.

shellyln commented 4 years ago

The latest commit can now be run without Webpack. b9da40b526b30ca71cae1239bf160ca545b02da9

npm run build
npm run start:v12

Node>=12.13.0 is required.