diff --git a/desktop/apps/auction/client.js b/desktop/apps/auction/client.js index 14c78736bbf..99e44be0616 100644 --- a/desktop/apps/auction/client.js +++ b/desktop/apps/auction/client.js @@ -34,7 +34,3 @@ export default () => { document.getElementById('react-root') ) } - -if (module.hot) { - module.hot.accept() -} diff --git a/desktop/apps/auction/components/App.js b/desktop/apps/auction/components/App.js index ff7a185b211..5763e6a95bb 100644 --- a/desktop/apps/auction/components/App.js +++ b/desktop/apps/auction/components/App.js @@ -22,3 +22,4 @@ export default class App extends Component { ) } } + diff --git a/desktop/apps/webpack/client.js b/desktop/apps/webpack/client.js new file mode 100644 index 00000000000..23fd7e87d0b --- /dev/null +++ b/desktop/apps/webpack/client.js @@ -0,0 +1,7 @@ +import App from './components/App' +import React from 'react' +import ReactDOM from 'react-dom' + +ReactDOM.render( + , document.getElementById('react-root') +) diff --git a/desktop/apps/webpack/components/App.js b/desktop/apps/webpack/components/App.js new file mode 100644 index 00000000000..7b52b2de6a0 --- /dev/null +++ b/desktop/apps/webpack/components/App.js @@ -0,0 +1,11 @@ +import React, { Component } from 'react' + +export default class App extends Component { + render () { + return ( +
+ hi! +
+ ) + } +} diff --git a/desktop/components/main_layout/templates/scripts.jade b/desktop/components/main_layout/templates/scripts.jade index d0cb45b8b6b..9422202cffe 100644 --- a/desktop/components/main_layout/templates/scripts.jade +++ b/desktop/components/main_layout/templates/scripts.jade @@ -115,7 +115,7 @@ if sharify != sharify.script() //- Add Google's jQuery -script( src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js" ) +//- script( src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js" ) //- Stripe if options.stripe diff --git a/lib/setup.js b/lib/setup.js index 956c1fa7b26..00310a87df1 100644 --- a/lib/setup.js +++ b/lib/setup.js @@ -159,30 +159,10 @@ export default function (app) { src: path.resolve(__dirname, '../desktop'), dest: path.resolve(__dirname, '../desktop/public') })) - // app.use(require('browserify-dev-middleware')({ - // src: path.resolve(__dirname, '../desktop'), - // transforms: [ - // require('babelify'), - // require('caching-coffeeify'), - // require('jadeify') - // ], - // insertGlobals: true, - // debug: true - // })) app.use(require('stylus').middleware({ src: path.resolve(__dirname, '../mobile'), dest: path.resolve(__dirname, '../mobile/public') })) - // app.use(require('browserify-dev-middleware')({ - // src: path.resolve(__dirname, '../mobile'), - // transforms: [ - // require('babelify'), - // require('caching-coffeeify'), - // require('jadeify') - // ], - // insertGlobals: true, - // debug: true - // })) } glob.sync(`${__dirname}/../{public,{desktop,mobile}/**/public}`) .forEach((fld) => app.use(express.static(fld))) diff --git a/lib/webpack-dev-server.js b/lib/webpack-dev-server.js index 46a21566ba5..aca71bef188 100644 --- a/lib/webpack-dev-server.js +++ b/lib/webpack-dev-server.js @@ -19,6 +19,7 @@ app.use(require('webpack-dev-middleware')(compiler, { } })) +// Testbed for various configurations app.get('/webpack', (req, res, next) => { res.send(` @@ -28,7 +29,7 @@ app.get('/webpack', (req, res, next) => {
- + `) diff --git a/package.json b/package.json index 0d4949c289d..0672adcbf96 100644 --- a/package.json +++ b/package.json @@ -148,6 +148,7 @@ "artsy-gemini-upload": "0.0.6", "babel-loader": "^7.1.2", "babel-plugin-styled-components": "^1.1.7", + "babel-preset-react-hmre": "^1.1.1", "background-check": "git://github.com/kennethcachia/background-check", "benv": "^3.3.0", "blueimp-file-upload": "9.9.0", @@ -193,6 +194,7 @@ "openseadragon": "^2.2.1", "progress-bar-webpack-plugin": "^1.10.0", "react-test-renderer": "^15.5.4", + "react-transform-hmr": "^1.0.4", "rewire": "2.2.0", "should": "^11.1.1", "sinon": "^1.17.1", diff --git a/webpack.config.js b/webpack.config.js index b3e0ac795b4..823ba9ed1b0 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -12,7 +12,13 @@ const isDeploy = isStaging || isProduction const config = { devtool: 'cheap-module-eval-source-map', - entry: getEntrypoints(), + entry: { + webpack: [ + 'webpack-hot-middleware/client?reload=true', + './desktop/apps/webpack/client.js' + ], + ...getEntrypoints() + }, output: { filename: '[name].js', path: path.resolve(__dirname, 'public/assets'), @@ -34,12 +40,28 @@ const config = { { test: /\.js$/, exclude: /node_modules/, - use: [{ - loader: 'babel-loader', - options: { - cacheDirectory: true + use: [ + { + loader: 'babel-loader', + query: { + cacheDirectory: true, + env: { + development: { + presets: ['react-hmre'], + plugins: [ + ['react-transform', { + transforms: [{ + transform: 'react-transform-hmr', + imports: ['react'], + locals: ['module'] + }] + }] + ] + } + } + } } - }] + ] }, { test: /\.json$/, @@ -129,7 +151,7 @@ function findAssets (basePath) { */ const assets = files .filter(validAssets) - .reduce((assetMap, file, index) => { + .reduce((assetMap, file) => { const fileName = path.basename(file, path.extname(file)) const asset = { [fileName]: [ @@ -138,7 +160,7 @@ function findAssets (basePath) { } if (isDevelopment) { - asset[fileName].push( + asset[fileName].unshift( 'webpack-hot-middleware/client?reload=true' ) } diff --git a/yarn.lock b/yarn.lock index eed628d7148..f741e43dcf8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -949,6 +949,12 @@ babel-plugin-react-docgen@^1.6.0: lodash "4.x.x" react-docgen "^2.15.0" +babel-plugin-react-transform@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/babel-plugin-react-transform/-/babel-plugin-react-transform-2.0.2.tgz#515bbfa996893981142d90b1f9b1635de2995109" + dependencies: + lodash "^4.6.1" + babel-plugin-rewire@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/babel-plugin-rewire/-/babel-plugin-rewire-1.1.0.tgz#a6b966d9d8c06c03d95dcda2eec4e2521519549b" @@ -1423,6 +1429,15 @@ babel-preset-react-app@^3.0.0: babel-preset-env "1.5.2" babel-preset-react "6.24.1" +babel-preset-react-hmre@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/babel-preset-react-hmre/-/babel-preset-react-hmre-1.1.1.tgz#d216e60cb5b8d4c873e19ed0f54eaff1437bc492" + dependencies: + babel-plugin-react-transform "^2.0.2" + react-transform-catch-errors "^1.0.2" + react-transform-hmr "^1.0.3" + redbox-react "^1.2.2" + babel-preset-react@6.24.1, babel-preset-react@^6.22.0, babel-preset-react@^6.24.1, babel-preset-react@^6.5.0: version "6.24.1" resolved "https://registry.yarnpkg.com/babel-preset-react/-/babel-preset-react-6.24.1.tgz#ba69dfaea45fc3ec639b6a4ecea6e17702c91380" @@ -3461,6 +3476,12 @@ error-ex@^1.2.0: dependencies: is-arrayish "^0.2.1" +error-stack-parser@^1.3.6: + version "1.3.6" + resolved "https://registry.yarnpkg.com/error-stack-parser/-/error-stack-parser-1.3.6.tgz#e0e73b93e417138d1cd7c0b746b1a4a14854c292" + dependencies: + stackframe "^0.3.1" + error-stack-parser@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/error-stack-parser/-/error-stack-parser-2.0.1.tgz#a3202b8fb03114aa9b40a0e3669e48b2b65a010a" @@ -4507,7 +4528,7 @@ glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.0, glob@^7.1.1, glob@~7.1.1: once "^1.3.0" path-is-absolute "^1.0.0" -global@^4.3.2: +global@^4.3.0, global@^4.3.2: version "4.3.2" resolved "https://registry.yarnpkg.com/global/-/global-4.3.2.tgz#e76989268a6c74c38908b1305b10fc0e394e9d0f" dependencies: @@ -5835,7 +5856,7 @@ lodash@3.0.x: version "3.0.1" resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.0.1.tgz#14d49028a38bc740241d11e2ecd57ec06d73c19a" -lodash@4.x.x, lodash@^4.0.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.5.1, lodash@~4.17.2: +lodash@4.x.x, lodash@^4.0.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.5.1, lodash@^4.6.1, lodash@~4.17.2: version "4.17.4" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae" @@ -7515,6 +7536,10 @@ react-autowhatever@^10.0.0: react-themeable "^1.1.0" section-iterator "^2.0.0" +react-deep-force-update@^1.0.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.1.1.tgz#bcd31478027b64b3339f108921ab520b4313dc2c" + react-docgen@^2.15.0: version "2.16.0" resolved "https://registry.yarnpkg.com/react-docgen/-/react-docgen-2.16.0.tgz#03c9eba935de8031d791ab62657b7b6606ec5da6" @@ -7614,6 +7639,13 @@ react-modal@^1.7.7: prop-types "^15.5.7" react-dom-factories "^1.0.0" +react-proxy@^1.1.7: + version "1.1.8" + resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-1.1.8.tgz#9dbfd9d927528c3aa9f444e4558c37830ab8c26a" + dependencies: + lodash "^4.6.1" + react-deep-force-update "^1.0.0" + react-redux@^5.0.2: version "5.0.5" resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.5.tgz#f8e8c7b239422576e52d6b7db06439469be9846a" @@ -7728,11 +7760,24 @@ react-themeable@^1.1.0: dependencies: object-assign "^3.0.0" +<<<<<<< HEAD react-tracking@^4.2.1: version "4.2.1" resolved "https://registry.yarnpkg.com/react-tracking/-/react-tracking-4.2.1.tgz#c34619ddd205609ea46281a6c8c8e1243e910e81" dependencies: lodash.merge "^4.6.0" +======= +react-transform-catch-errors@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/react-transform-catch-errors/-/react-transform-catch-errors-1.0.2.tgz#1b4d4a76e97271896fc16fe3086c793ec88a9eeb" + +react-transform-hmr@^1.0.3, react-transform-hmr@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/react-transform-hmr/-/react-transform-hmr-1.0.4.tgz#e1a40bd0aaefc72e8dfd7a7cda09af85066397bb" + dependencies: + global "^4.3.0" + react-proxy "^1.1.7" +>>>>>>> Add react-transform-hmr for auto listeners react-transition-group@^1.1.2: version "1.2.0" @@ -7919,6 +7964,15 @@ rechoir@^0.6.2: dependencies: resolve "^1.1.6" +redbox-react@^1.2.2: + version "1.5.0" + resolved "https://registry.yarnpkg.com/redbox-react/-/redbox-react-1.5.0.tgz#04dab11557d26651bf3562a67c22ace56c5d3967" + dependencies: + error-stack-parser "^1.3.6" + object-assign "^4.0.1" + prop-types "^15.5.4" + sourcemapped-stacktrace "^1.1.6" + redent@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/redent/-/redent-1.0.0.tgz#cf916ab1fd5f1f16dfb20822dd6ec7f730c2afde" @@ -8593,7 +8647,7 @@ source-map@0.4.x, source-map@~0.4.0, source-map@~0.4.2: dependencies: amdefine ">=0.0.4" -source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, source-map@~0.5.0, source-map@~0.5.1, source-map@~0.5.3: +source-map@0.5.6, source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, source-map@~0.5.0, source-map@~0.5.1, source-map@~0.5.3: version "0.5.6" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412" @@ -8603,6 +8657,12 @@ source-map@~0.2.0: dependencies: amdefine ">=0.0.4" +sourcemapped-stacktrace@^1.1.6: + version "1.1.7" + resolved "https://registry.yarnpkg.com/sourcemapped-stacktrace/-/sourcemapped-stacktrace-1.1.7.tgz#17e05374ff78b71a9d89ad3975a49f22725ba935" + dependencies: + source-map "0.5.6" + spawn-command@^0.0.2-1: version "0.0.2" resolved "https://registry.yarnpkg.com/spawn-command/-/spawn-command-0.0.2.tgz#9544e1a43ca045f8531aac1a48cb29bdae62338e" @@ -8665,6 +8725,10 @@ stack-trace@0.0.9, stack-trace@0.0.x: version "0.0.9" resolved "https://registry.yarnpkg.com/stack-trace/-/stack-trace-0.0.9.tgz#a8f6eaeca90674c333e7c43953f275b451510695" +stackframe@^0.3.1: + version "0.3.1" + resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-0.3.1.tgz#33aa84f1177a5548c8935533cbfeb3420975f5a4" + stackframe@^1.0.3: version "1.0.4" resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.0.4.tgz#357b24a992f9427cba6b545d96a14ed2cbca187b"