| const fs = require('fs'); | |
| const nodePath = require('path'); | |
| const paths = require('tsconfig-paths'); | |
| // этот модуль умеет рекурсивно раскрывать extends | |
| const tsconfig = require('tsconfig-extends'); | |
| const Project = require('ts-simple-ast').default; | |
| module.exports = async ({ | |
| tsconfigPath: incomingTSConfigPath, | |
| filesGlob, |
| const ts = require('typescript'); | |
| const { existsSync, readFileSync } = require('fs'); | |
| const { resolve, dirname } = require('path'); | |
| const readFile = (fname) => readFileSync(fname, 'utf8'); | |
| const normalizeSlashes = (value) => value.replace(/\\/g, '/'); | |
| module.exports = ({ | |
| cwd = process.cwd(), | |
| project, |
| import * as nodePath from 'path'; | |
| import paths from 'tsconfig-paths'; | |
| import * as tsconfig from 'tsconfig-extends'; | |
| import Project from 'ts-simple-ast'; | |
| // use `tsconfig-extends` module cause it can recursively apply "extends" field | |
| const compilerOptions = tsconfig.load_file_sync('./tsconfig.json'); | |
| const absoluteBaseUrl = nodePath.join(process.cwd(), compilerOptions.baseUrl); | |
| const matchPathFunc = paths.createMatchPath(absoluteBaseUrl, compilerOptions.paths || {}); | |
| const project = new Project({ compilerOptions }); |
При написании компонента необходимо добавить его реэкспорт в index.ts родительской директории:
// src/components/YourComponent/YourComponent.tsx
export interface YourComponentProps {}
export default class YourComponent extends React.PureComponent<YourComponentProps>
// src/components/index.ts
// ...other reexports
export { default as YourComponent, YourComponentProps } from './YourComponent/YourComponent';
| <!DOCTYPE HTML> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title></title> | |
| <script type="text/javascript" src="index.js"></script> | |
| <style type="text/css"> | |
| #canvas | |
| { |
| /*! d3.chart - v0.1.3 | |
| * License: MIT Expat | |
| * Date: 2013-10-07 | |
| */ | |
| (function(t){"use strict";var e=t.d3Chart,r=t.d3Chart={},n=t.d3;r.noConflict=function(){return t.d3Chart=e,r},r.assert=function(t,e){if(!t)throw Error("[d3.chart] "+e)},r.assert(n,"d3.js is required"),r.assert("string"==typeof n.version&&n.version.match(/^3/),"d3.js version 3 is required")})(this),function(t){"use strict";var e=t.d3Chart,r=t.d3,n=function(t){e.assert(t,"Layers must be initialized with a base."),this._base=t,this._handlers={}};n.prototype.dataBind=function(){e.assert(!1,"Layers must specify a `dataBind` method.")},n.prototype.insert=function(){e.assert(!1,"Layers must specify an `insert` method.")},n.prototype.on=function(t,e,r){r=r||{},t in this._handlers||(this._handlers[t]=[]),this._handlers[t].push({callback:e,chart:r.chart||null})},n.prototype.off=function(t,e){var r,n=this._handlers[t];if(n){if(1===arguments.length)return n.length=0,undefined;for(r=n.length-1;r>-1;--r)n[r].callback===e&&n.splice(r,1)}},n.prototype.draw |
Switch between stacked and grouped layouts using sequenced transitions! Animations preserve object constancy and allow the user to follow the data across views. Animation design by Heer and Robertson. Colors and data generation inspired by Byron and Wattenberg.