aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website
diff options
context:
space:
mode:
authorfragosti <francesco.agosti93@gmail.com>2018-10-05 06:03:14 +0800
committerfragosti <francesco.agosti93@gmail.com>2018-10-05 06:03:14 +0800
commit1e3ab76e9a6e4f50b105c62f7930408fae1cc661 (patch)
tree96df72933dd182f32b625fdb8099d40d5eba68e2 /packages/website
parentba2ba628e815c996582c6ead81f657a14a00abd0 (diff)
parentab28e6af3507d7eea163e37730e68a101b525237 (diff)
downloaddexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.tar
dexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.tar.gz
dexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.tar.bz2
dexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.tar.lz
dexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.tar.xz
dexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.tar.zst
dexon-sol-tools-1e3ab76e9a6e4f50b105c62f7930408fae1cc661.zip
Merge branch 'development' of https://github.com/0xProject/0x-monorepo into feature/instant/redux-styles-container
Diffstat (limited to 'packages/website')
-rw-r--r--packages/website/README.md2
-rw-r--r--packages/website/package.json29
-rw-r--r--packages/website/ts/index.tsx30
-rw-r--r--packages/website/ts/lazy_component.tsx2
-rw-r--r--packages/website/webpack.config.js93
5 files changed, 79 insertions, 77 deletions
diff --git a/packages/website/README.md b/packages/website/README.md
index 7115a3b5c..2edc17cd9 100644
--- a/packages/website/README.md
+++ b/packages/website/README.md
@@ -14,7 +14,7 @@ Please read our [contribution guidelines](../../CONTRIBUTING.md) before getting
## Local Dev Setup
-Requires Node version 6.9.5 or higher.
+Requires Node version 6.9.5 or higher
Add the following to your `/etc/hosts` file:
diff --git a/packages/website/package.json b/packages/website/package.json
index 8c115d8a0..3cf243645 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -7,11 +7,11 @@
"private": true,
"description": "Website and 0x portal dapp",
"scripts": {
- "build": "NODE_ENV=production node --max_old_space_size=8192 ../../node_modules/.bin/webpack",
- "build:ci": "yarn build",
+ "build": "node --max_old_space_size=8192 ../../node_modules/.bin/webpack --mode production",
+ "build:dev": "../../node_modules/.bin/webpack --mode development",
"clean": "shx rm -f public/bundle*",
"lint": "tslint --project . 'ts/**/*.ts' 'ts/**/*.tsx'",
- "watch_without_deps": "webpack-dev-server --content-base public --https",
+ "dev": "webpack-dev-server --mode development --content-base public --https",
"deploy_dogfood": "npm run build; aws s3 sync ./public/. s3://dogfood.0xproject.com --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers",
"deploy_staging": "npm run build; aws s3 sync ./public/. s3://staging-0xproject --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers",
"deploy_live": "DEPLOY_ROLLBAR_SOURCEMAPS=true npm run build; aws s3 sync ./public/. s3://0xproject.com --profile 0xproject --region us-east-1 --grants read=uri=http://acs.amazonaws.com/groups/global/AllUsers --exclude *.map.js"
@@ -87,26 +87,23 @@
"@types/react-tap-event-plugin": "0.0.30",
"@types/redux": "^3.6.0",
"@types/web3-provider-engine": "^14.0.0",
- "awesome-typescript-loader": "^3.1.3",
- "copy-webpack-plugin": "^4.0.1",
+ "awesome-typescript-loader": "^5.2.1",
"copyfiles": "^2.0.0",
"css-loader": "0.23.x",
- "exports-loader": "0.6.x",
- "imports-loader": "0.6.x",
- "json-loader": "^0.5.4",
- "less-loader": "^2.2.3",
+ "less-loader": "^4.1.0",
"make-promises-safe": "^1.1.0",
"raw-loader": "^0.5.1",
- "rollbar-sourcemap-webpack-plugin": "^2.3.0",
+ "rollbar-sourcemap-webpack-plugin": "^2.4.0",
"shx": "^0.2.2",
- "source-map-loader": "^0.1.6",
- "style-loader": "0.13.x",
+ "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": "^1.2.5",
- "webpack": "^3.1.0",
- "webpack-dev-middleware": "^1.10.0",
- "webpack-dev-server": "^2.5.0"
+ "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/website/ts/index.tsx b/packages/website/ts/index.tsx
index 9e59b00ac..d4a79cc4f 100644
--- a/packages/website/ts/index.tsx
+++ b/packages/website/ts/index.tsx
@@ -26,47 +26,47 @@ import 'less/all.less';
// We pass modulePromise returning lambda instead of module promise,
// cause we only want to import the module when the user navigates to the page.
-// At the same time webpack statically parses for System.import() to determine bundle chunk split points
-// so each lazy import needs it's own `System.import()` declaration.
+// At the same time webpack statically parses for import() to determine bundle chunk split points
+// so each lazy import needs it's own `import()` declaration.
const LazyPortal = createLazyComponent('Portal', async () =>
- System.import<any>(/* webpackChunkName: "portal" */ 'ts/containers/portal'),
+ import(/* webpackChunkName: "portal" */ 'ts/containers/portal'),
);
const LazyZeroExJSDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "zeroExDocs" */ 'ts/containers/zero_ex_js_documentation'),
+ import(/* webpackChunkName: "zeroExDocs" */ 'ts/containers/zero_ex_js_documentation'),
);
const LazyContractWrappersDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "contractWrapperDocs" */ 'ts/containers/contract_wrappers_documentation'),
+ import(/* webpackChunkName: "contractWrapperDocs" */ 'ts/containers/contract_wrappers_documentation'),
);
const LazyOrderWatcherDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "orderWatcherDocs" */ 'ts/containers/order_watcher_documentation'),
+ import(/* webpackChunkName: "orderWatcherDocs" */ 'ts/containers/order_watcher_documentation'),
);
const LazySmartContractsDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "smartContractDocs" */ 'ts/containers/smart_contracts_documentation'),
+ import(/* webpackChunkName: "smartContractDocs" */ 'ts/containers/smart_contracts_documentation'),
);
const LazyConnectDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "connectDocs" */ 'ts/containers/connect_documentation'),
+ import(/* webpackChunkName: "connectDocs" */ 'ts/containers/connect_documentation'),
);
const LazyWeb3WrapperDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "web3WrapperDocs" */ 'ts/containers/web3_wrapper_documentation'),
+ import(/* webpackChunkName: "web3WrapperDocs" */ 'ts/containers/web3_wrapper_documentation'),
);
const LazySolCompilerDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "solCompilerDocs" */ 'ts/containers/sol_compiler_documentation'),
+ import(/* webpackChunkName: "solCompilerDocs" */ 'ts/containers/sol_compiler_documentation'),
);
const LazyJSONSchemasDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "jsonSchemasDocs" */ 'ts/containers/json_schemas_documentation'),
+ import(/* webpackChunkName: "jsonSchemasDocs" */ 'ts/containers/json_schemas_documentation'),
);
const LazySolCovDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "solCovDocs" */ 'ts/containers/sol_cov_documentation'),
+ import(/* webpackChunkName: "solCovDocs" */ 'ts/containers/sol_cov_documentation'),
);
const LazySubprovidersDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "subproviderDocs" */ 'ts/containers/subproviders_documentation'),
+ import(/* webpackChunkName: "subproviderDocs" */ 'ts/containers/subproviders_documentation'),
);
const LazyOrderUtilsDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "orderUtilsDocs" */ 'ts/containers/order_utils_documentation'),
+ import(/* webpackChunkName: "orderUtilsDocs" */ 'ts/containers/order_utils_documentation'),
);
const LazyEthereumTypesDocumentation = createLazyComponent('Documentation', async () =>
- System.import<any>(/* webpackChunkName: "ethereumTypesDocs" */ 'ts/containers/ethereum_types_documentation'),
+ import(/* webpackChunkName: "ethereumTypesDocs" */ 'ts/containers/ethereum_types_documentation'),
);
const DOCUMENT_TITLE = '0x: The Protocol for Trading Tokens';
diff --git a/packages/website/ts/lazy_component.tsx b/packages/website/ts/lazy_component.tsx
index dce06ed8d..9d3b9944a 100644
--- a/packages/website/ts/lazy_component.tsx
+++ b/packages/website/ts/lazy_component.tsx
@@ -49,7 +49,7 @@ export class LazyComponent extends React.Component<LazyComponentProps, LazyCompo
* @param componentName name of exported component
* @param lazyImport lambda returning module promise
* we pass a lambda because we only want to require a module if it's used
- * @example `const LazyPortal = createLazyComponent('Portal', () => System.import<any>('ts/containers/portal'));``
+ * @example `const LazyPortal = createLazyComponent('Portal', () => import<any>('ts/containers/portal'));``
*/
export const createLazyComponent = (componentName: string, lazyImport: () => Promise<any>) => {
return (props: any) => {
diff --git a/packages/website/webpack.config.js b/packages/website/webpack.config.js
index 8653196a6..ec265be93 100644
--- a/packages/website/webpack.config.js
+++ b/packages/website/webpack.config.js
@@ -1,6 +1,6 @@
const path = require('path');
const webpack = require('webpack');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
const RollbarSourceMapPlugin = require('rollbar-sourcemap-webpack-plugin');
const childProcess = require('child_process');
@@ -9,44 +9,7 @@ const GIT_SHA = childProcess
.toString()
.trim();
-const generatePlugins = () => {
- let plugins = [];
- if (process.env.NODE_ENV === 'production') {
- plugins = plugins.concat([
- // Since we do not use moment's locale feature, we exclude them from the bundle.
- // This reduces the bundle size by 0.4MB.
- new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
- new webpack.DefinePlugin({
- 'process.env': {
- NODE_ENV: JSON.stringify(process.env.NODE_ENV),
- GIT_SHA: JSON.stringify(GIT_SHA),
- },
- }),
- // TODO: Revert to webpack bundled version with webpack v4.
- // The v3 series bundled version does not support ES6 and
- // fails to build.
- new UglifyJsPlugin({
- sourceMap: true,
- uglifyOptions: {
- mangle: {
- reserved: ['BigNumber'],
- },
- },
- }),
- ]);
- if (process.env.DEPLOY_ROLLBAR_SOURCEMAPS === 'true') {
- plugins = plugins.concat([
- new RollbarSourceMapPlugin({
- accessToken: '32c39bfa4bb6440faedc1612a9c13d28',
- version: GIT_SHA,
- publicPath: 'https://0xproject.com/',
- }),
- ]);
- }
- }
- return plugins;
-};
-module.exports = {
+const config = {
entry: ['./ts/index.tsx'],
output: {
path: path.join(__dirname, '/public'),
@@ -92,10 +55,18 @@ module.exports = {
test: /\.css$/,
loaders: ['style-loader', 'css-loader'],
},
- {
- test: /\.json$/,
- loader: 'json-loader',
- },
+ ],
+ },
+ optimization: {
+ minimizer: [
+ new TerserPlugin({
+ sourceMap: true,
+ terserOptions: {
+ mangle: {
+ reserved: ['BigNumber'],
+ },
+ },
+ }),
],
},
devServer: {
@@ -115,5 +86,39 @@ module.exports = {
},
disableHostCheck: true,
},
- plugins: generatePlugins(),
+};
+
+module.exports = (_env, argv) => {
+ let plugins = [];
+ if (argv.mode === 'development') {
+ config.mode = 'development';
+ } else {
+ config.mode = 'production';
+ plugins = plugins.concat([
+ // Since we do not use moment's locale feature, we exclude them from the bundle.
+ // This reduces the bundle size by 0.4MB.
+ new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
+ new webpack.DefinePlugin({
+ 'process.env': {
+ NODE_ENV: JSON.stringify(process.env.NODE_ENV),
+ GIT_SHA: JSON.stringify(GIT_SHA),
+ },
+ }),
+ ]);
+ if (process.env.DEPLOY_ROLLBAR_SOURCEMAPS === 'true') {
+ plugins = plugins.concat([
+ new RollbarSourceMapPlugin({
+ accessToken: '32c39bfa4bb6440faedc1612a9c13d28',
+ version: GIT_SHA,
+ publicPath: 'https://0xproject.com/',
+ }),
+ ]);
+ }
+ }
+ console.log('i 「atl」: Mode: ', config.mode);
+
+ config.plugins = plugins;
+ console.log('i 「atl」: Plugin Count: ', config.plugins.length);
+
+ return config;
};