From 6c0d31738062b113bd34b5438a2e3c8bfbfb385b Mon Sep 17 00:00:00 2001 From: Leonid Logvinov Date: Wed, 10 Oct 2018 14:44:50 +0200 Subject: Initial project scaffolding --- packages/dev-tools-pages/README.md | 59 ++++++++++++++++ packages/dev-tools-pages/less/all.less | 0 packages/dev-tools-pages/package.json | 54 +++++++++++++++ .../public/images/favicon/favicon-2-16x16.png | Bin 0 -> 684 bytes .../public/images/favicon/favicon-2-32x32.png | Bin 0 -> 1567 bytes .../public/images/favicon/favicon.ico | Bin 0 -> 5430 bytes packages/dev-tools-pages/public/index.html | 22 ++++++ .../dev-tools-pages/ts/components/meta_tags.tsx | 25 +++++++ packages/dev-tools-pages/ts/globals.d.ts | 9 +++ packages/dev-tools-pages/ts/index.tsx | 15 ++++ .../dev-tools-pages/ts/pages/landing/landing.tsx | 15 ++++ packages/dev-tools-pages/ts/utils/utils.ts | 32 +++++++++ packages/dev-tools-pages/tsconfig.json | 21 ++++++ packages/dev-tools-pages/tslint.json | 10 +++ packages/dev-tools-pages/webpack.config.js | 77 +++++++++++++++++++++ 15 files changed, 339 insertions(+) create mode 100644 packages/dev-tools-pages/README.md create mode 100644 packages/dev-tools-pages/less/all.less create mode 100644 packages/dev-tools-pages/package.json create mode 100755 packages/dev-tools-pages/public/images/favicon/favicon-2-16x16.png create mode 100755 packages/dev-tools-pages/public/images/favicon/favicon-2-32x32.png create mode 100755 packages/dev-tools-pages/public/images/favicon/favicon.ico create mode 100644 packages/dev-tools-pages/public/index.html create mode 100644 packages/dev-tools-pages/ts/components/meta_tags.tsx create mode 100644 packages/dev-tools-pages/ts/globals.d.ts create mode 100644 packages/dev-tools-pages/ts/index.tsx create mode 100644 packages/dev-tools-pages/ts/pages/landing/landing.tsx create mode 100644 packages/dev-tools-pages/ts/utils/utils.ts create mode 100644 packages/dev-tools-pages/tsconfig.json create mode 100644 packages/dev-tools-pages/tslint.json create mode 100644 packages/dev-tools-pages/webpack.config.js (limited to 'packages/dev-tools-pages') diff --git a/packages/dev-tools-pages/README.md b/packages/dev-tools-pages/README.md new file mode 100644 index 000000000..ce8edc103 --- /dev/null +++ b/packages/dev-tools-pages/README.md @@ -0,0 +1,59 @@ +## Dev tools pages + +This repository contains our dev tools pages. + +## Contributing + +We strongly recommend that the community help us make improvements and determine the future direction of the protocol. To report bugs within this package, please create an issue in this repository. + +Please read our [contribution guidelines](../../CONTRIBUTING.md) before getting started. + +## Local Dev Setup + +Requires Node version 6.9.5 or higher + +### Install dependencies: + +```bash +yarn install +``` + +### Initial setup + +To build this package and all other monorepo packages that it depends on, run the following from the monorepo root directory: + +```bash +PKG=@0xproject/dev-tools-pages yarn build +``` + +### Run dev server + +```bash +PKG=@0xproject/dev-tools-pages yarn watch +``` + +Visit [http://localhost:3572/](http://localhost:3572/) in your browser. + +### Clean + +```bash +yarn clean +``` + +### Lint + +```bash +yarn lint +``` + +### Resources + +##### Toolkit + +* [Styled Components](https://www.styled-components.com/) +* [Rebass](https://rebassjs.org/) + +##### Recommended Atom packages: + +* [atom-typescript](https://atom.io/packages/atom-typescript) +* [linter-tslint](https://atom.io/packages/linter-tslint) diff --git a/packages/dev-tools-pages/less/all.less b/packages/dev-tools-pages/less/all.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/dev-tools-pages/package.json b/packages/dev-tools-pages/package.json new file mode 100644 index 000000000..436f2f5b1 --- /dev/null +++ b/packages/dev-tools-pages/package.json @@ -0,0 +1,54 @@ +{ + "name": "@0xproject/dev-tools-pages", + "version": "0.0.1", + "engines": { + "node": ">=6.12" + }, + "private": true, + "description": "0x Dev tools pages", + "scripts": { + "build": "node --max_old_space_size=8192 ../../node_modules/.bin/webpack --mode production", + "build:ci": "yarn build", + "build:dev": "../../node_modules/.bin/webpack --mode development", + "clean": "shx rm -f public/bundle*", + "lint": "tslint --project . 'ts/**/*.ts' 'ts/**/*.tsx'", + "dev": "webpack-dev-server --mode development --content-base public" + }, + "license": "Apache-2.0", + "dependencies": { + "basscss": "^8.0.3", + "less": "^2.7.2", + "lodash": "^4.17.5", + "react": "^16.4.2", + "react-document-title": "^2.0.3", + "react-dom": "^16.4.2", + "react-helmet": "^5.2.0", + "styled-components": "^3.3.0" + }, + "devDependencies": { + "@types/lodash": "4.14.104", + "@types/node": "*", + "@types/react": "^16.4.2", + "@types/react-dom": "^16.0.7", + "@types/react-helmet": "^5.0.6", + "@types/react-router-dom": "^4.0.4", + "@types/react-tap-event-plugin": "0.0.30", + "awesome-typescript-loader": "^5.2.1", + "copyfiles": "^2.0.0", + "css-loader": "0.23.x", + "less-loader": "^4.1.0", + "make-promises-safe": "^1.1.0", + "raw-loader": "^0.5.1", + "shx": "^0.2.2", + "source-map-loader": "^0.2.4", + "style-loader": "0.23.x", + "terser-webpack-plugin": "^1.1.0", + "tslint": "5.11.0", + "tslint-config-0xproject": "^0.0.2", + "typescript": "3.0.1", + "uglifyjs-webpack-plugin": "^2.0.1", + "webpack": "^4.20.2", + "webpack-cli": "3.1.2", + "webpack-dev-server": "^3.1.9" + } +} diff --git a/packages/dev-tools-pages/public/images/favicon/favicon-2-16x16.png b/packages/dev-tools-pages/public/images/favicon/favicon-2-16x16.png new file mode 100755 index 000000000..68c493c4f Binary files /dev/null and b/packages/dev-tools-pages/public/images/favicon/favicon-2-16x16.png differ diff --git a/packages/dev-tools-pages/public/images/favicon/favicon-2-32x32.png b/packages/dev-tools-pages/public/images/favicon/favicon-2-32x32.png new file mode 100755 index 000000000..a5abb0eb3 Binary files /dev/null and b/packages/dev-tools-pages/public/images/favicon/favicon-2-32x32.png differ diff --git a/packages/dev-tools-pages/public/images/favicon/favicon.ico b/packages/dev-tools-pages/public/images/favicon/favicon.ico new file mode 100755 index 000000000..b7ada2a1c Binary files /dev/null and b/packages/dev-tools-pages/public/images/favicon/favicon.ico differ diff --git a/packages/dev-tools-pages/public/index.html b/packages/dev-tools-pages/public/index.html new file mode 100644 index 000000000..5137eed95 --- /dev/null +++ b/packages/dev-tools-pages/public/index.html @@ -0,0 +1,22 @@ + + + + + + + + + + + + 0x: The Protocol for Trading Tokens + + + + + +
+ + + + \ No newline at end of file diff --git a/packages/dev-tools-pages/ts/components/meta_tags.tsx b/packages/dev-tools-pages/ts/components/meta_tags.tsx new file mode 100644 index 000000000..f6c43d23f --- /dev/null +++ b/packages/dev-tools-pages/ts/components/meta_tags.tsx @@ -0,0 +1,25 @@ +import * as React from 'react'; +import { Helmet } from 'react-helmet'; + +export interface MetaTagsProps { + title: string; + description: string; + imgSrc?: string; +} + +export const MetaTags: React.StatelessComponent = ({ title, description, imgSrc }) => ( + + {title} + + + + + + + + +); + +MetaTags.defaultProps = { + imgSrc: '/images/og_image.png', +}; diff --git a/packages/dev-tools-pages/ts/globals.d.ts b/packages/dev-tools-pages/ts/globals.d.ts new file mode 100644 index 000000000..d0890161c --- /dev/null +++ b/packages/dev-tools-pages/ts/globals.d.ts @@ -0,0 +1,9 @@ +declare module 'whatwg-fetch'; +declare module 'react-document-title'; + +declare module '*.json' { + const json: any; + /* tslint:disable */ + export default json; + /* tslint:enable */ +} diff --git a/packages/dev-tools-pages/ts/index.tsx b/packages/dev-tools-pages/ts/index.tsx new file mode 100644 index 000000000..f4db2ea3c --- /dev/null +++ b/packages/dev-tools-pages/ts/index.tsx @@ -0,0 +1,15 @@ +import * as React from 'react'; +import { render } from 'react-dom'; +import { MetaTags } from 'ts/components/meta_tags'; +import { Landing } from 'ts/pages/landing/landing'; + +const DOCUMENT_TITLE = ''; +const DOCUMENT_DESCRIPTION = ''; + +render( +
+ + +
, + document.getElementById('app'), +); diff --git a/packages/dev-tools-pages/ts/pages/landing/landing.tsx b/packages/dev-tools-pages/ts/pages/landing/landing.tsx new file mode 100644 index 000000000..a6cb89a7b --- /dev/null +++ b/packages/dev-tools-pages/ts/pages/landing/landing.tsx @@ -0,0 +1,15 @@ +import * as _ from 'lodash'; +import * as React from 'react'; + +interface LandingProps {} + +interface LandingState {} + +export class Landing extends React.Component { + constructor(props: LandingProps) { + super(props); + } + public render(): React.ReactNode { + return
; + } +} diff --git a/packages/dev-tools-pages/ts/utils/utils.ts b/packages/dev-tools-pages/ts/utils/utils.ts new file mode 100644 index 000000000..b274706a2 --- /dev/null +++ b/packages/dev-tools-pages/ts/utils/utils.ts @@ -0,0 +1,32 @@ +import * as bowser from 'bowser'; +import * as _ from 'lodash'; + +export const utils = { + getColSize(items: number): number { + const bassCssGridSize = 12; // Source: http://basscss.com/#basscss-grid + const colSize = bassCssGridSize / items; + if (!_.isInteger(colSize)) { + throw new Error(`Number of cols must be divisible by ${bassCssGridSize}`); + } + return colSize; + }, + getCurrentBaseUrl(): string { + const port = window.location.port; + const hasPort = !_.isUndefined(port); + const baseUrl = `https://${window.location.hostname}${hasPort ? `:${port}` : ''}`; + return baseUrl; + }, + onPageLoadPromise: new Promise((resolve, _reject) => { + if (document.readyState === 'complete') { + resolve(); + return; + } + window.onload = () => resolve(); + }), + openUrl(url: string): void { + window.open(url, '_blank'); + }, + isMobileOperatingSystem(): boolean { + return bowser.mobile; + }, +}; diff --git a/packages/dev-tools-pages/tsconfig.json b/packages/dev-tools-pages/tsconfig.json new file mode 100644 index 000000000..f5d4f62c2 --- /dev/null +++ b/packages/dev-tools-pages/tsconfig.json @@ -0,0 +1,21 @@ +{ + "extends": "../../tsconfig", + "compilerOptions": { + "allowSyntheticDefaultImports": true, + "outDir": "./transpiled/", + "jsx": "react", + "baseUrl": "./", + // tsconfig.json at the monorepo root contains some options required for + // project references which do not work for website. We override those + // options here. + "declaration": false, + "declarationMap": false, + "noUnusedLocals": true, + "noUnusedParameters": true, + "composite": false, + "paths": { + "*": ["node_modules/@types/*", "*"] + } + }, + "include": ["./ts/**/*"] +} diff --git a/packages/dev-tools-pages/tslint.json b/packages/dev-tools-pages/tslint.json new file mode 100644 index 000000000..b55ffe90f --- /dev/null +++ b/packages/dev-tools-pages/tslint.json @@ -0,0 +1,10 @@ +{ + "extends": ["@0xproject/tslint-config"], + "rules": { + "no-implicit-dependencies": false, + "no-object-literal-type-assertion": false, + "completed-docs": false, + "prefer-function-over-method": false, + "custom-no-magic-numbers": false + } +} diff --git a/packages/dev-tools-pages/webpack.config.js b/packages/dev-tools-pages/webpack.config.js new file mode 100644 index 000000000..1df41212f --- /dev/null +++ b/packages/dev-tools-pages/webpack.config.js @@ -0,0 +1,77 @@ +const path = require('path'); +const webpack = require('webpack'); +const TerserPlugin = require('terser-webpack-plugin'); +const childProcess = require('child_process'); + +const config = { + entry: ['./ts/index.tsx'], + output: { + path: path.join(__dirname, '/public'), + filename: 'bundle.js', + chunkFilename: 'bundle-[name].js', + publicPath: '/', + }, + devtool: 'source-map', + resolve: { + modules: [path.join(__dirname, '/ts'), 'node_modules'], + extensions: ['.ts', '.tsx', '.js', '.jsx', '.json'], + alias: { + ts: path.join(__dirname, '/ts'), + less: path.join(__dirname, '/less'), + }, + }, + module: { + rules: [ + { + test: /\.js$/, + loader: 'source-map-loader', + exclude: [ + // instead of /\/node_modules\// + path.join(process.cwd(), 'node_modules'), + path.join(process.cwd(), '../..', 'node_modules'), + ], + }, + { + test: /\.tsx?$/, + loader: 'awesome-typescript-loader', + }, + { + test: /\.md$/, + use: 'raw-loader', + }, + ], + }, + optimization: { + minimizer: [ + new TerserPlugin({ + sourceMap: true, + }), + ], + }, + devServer: { + port: 3572, + disableHostCheck: true, + }, +}; + +module.exports = (_env, argv) => { + let plugins = []; + if (argv.mode === 'development') { + config.mode = 'development'; + } else { + config.mode = 'production'; + plugins = plugins.concat([ + new webpack.DefinePlugin({ + 'process.env': { + NODE_ENV: JSON.stringify(process.env.NODE_ENV), + }, + }), + ]); + } + console.log('i ｢atl｣: Mode: ', config.mode); + + config.plugins = plugins; + console.log('i ｢atl｣: Plugin Count: ', config.plugins.length); + + return config; +}; -- cgit v1.2.3