Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Webpack4 migrate #958

Merged
merged 9 commits into from
Oct 12, 2018
Merged

Webpack4 migrate #958

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
86d87e8
migration to webpack 4
Sep 26, 2018
6b1c10c
react 16 update, udpate all packages, instead react-router, some babe…
newnewyear Sep 26, 2018
2909461
repo version 4
newnewyear Sep 26, 2018
2d6acd4
add package-lock
newnewyear Sep 26, 2018
c7aab7d
set tested node engines v
newnewyear Sep 26, 2018
a28c898
fx notes, 2 warnings left - post-css @apply and limit bundle sizes
newnewyear Sep 28, 2018
4d3204f
fx warning - only @apply css left. fx notes
newnewyear Sep 28, 2018
0545025
fx notes
newnewyear Oct 1, 2018
03c2acf
readme packages versions
newnewyear Oct 1, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion app/tests/components/MainSection-test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import React from 'react';
import expect from 'expect';
import { mount, configure, } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import MainSection from '../../components/MainSection';
import TopicItem from '../../components/TopicItem';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

Expand Down
4 changes: 2 additions & 2 deletions app/tests/setup.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
require('babel-register') ({
presets: ['es2015', 'react', 'stage-0']
});
var jsdom = require('jsdom');
const jsdom = require('jsdom');
const { JSDOM } = jsdom;

var exposedProperties = ['window', 'navigator', 'document'];
const exposedProperties = ['window', 'navigator', 'document'];

const { document } = (new JSDOM('<!doctype><html><head></head><body></body></html>', {
url: 'http://localhost:3001'
Expand Down
3 changes: 2 additions & 1 deletion server/db/mongo/constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
export const db = process.env.MONGOHQ_URL || process.env.MONGODB_URI || 'mongodb://localhost/ReactWebpackNode';
// export const db = process.env.MONGOHQ_URL || process.env.MONGODB_URI || 'mongodb://localhost/ReactWebpackNode';
export const db = 'mongodb://reactgo_user_1:rgouser1pass@ds215093.mlab.com:15093/reactgo_sample';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

revert this ;)


export default {
db
Expand Down
5 changes: 4 additions & 1 deletion webpack/paths.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,10 @@ module.exports = {
assets: path.resolve(CURRENT_WORKING_DIR, 'public', 'assets'),
compiled: path.resolve(CURRENT_WORKING_DIR, 'compiled'),
public: '/assets/', // use absolute path for css-loader?
prod_public: '/', // use absolute path for css-loader?
prod_public: '/', // public path for production build should be like this
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for adding the additional info. I do have a feeling that this is actually a problem with the rendering and/or webpack asset serving in dev mode (hmr etc9 and not the output parameter, I will take a look.

Also, If we keep these, let's try to inline the comments, something like:

public: '/assets/',
prod_public: '/', // prod assets area already prefixed with '/assets/'

/*
* In prod with public: '/assets/' the app tries to get the js and css from '/assets//assets/*' . Just changed the prod publicPath for '/'.
*/
modules: path.resolve(CURRENT_WORKING_DIR, 'node_modules')
};

10 changes: 1 addition & 9 deletions webpack/plugins.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
const webpack = require('webpack');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');

module.exports = ({ production = false, browser = false } = {}) => {
Expand Down Expand Up @@ -43,11 +43,3 @@ module.exports = ({ production = false, browser = false } = {}) => {
}
return [];
};
// migration to webpack 4
// change webpack config:
// 1 replace ExtractTextPlugin with MiniCssExtractPlugin
// 2 required packages updates
// 3 add production public path
// 4 everything is working as expected
// 5 will migrate to react 16

2 changes: 1 addition & 1 deletion webpack/rules/css.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ module.exports = ({ production = false, browser = false } = {}) => {
*
* Referenced from: https://github.com/webpack-contrib/css-loader#css-scope
*
* For prerendering with extract-text-webpack-plugin (replaced with mini-css-extract-plugin) you should use
* For prerendering with mini-css-extract-plugin you should use
* css-loader/locals instead of style-loader!css-loader in the prerendering bundle.
* It doesn't embed CSS but only exports the identifier mappings.
*/
Expand Down