I've got a node app that uses react-router to render React views server-side. My issue is that I'm using package weekThree;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
import java.awt.*;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.util.*;
@SuppressWarnings("serial")
public class Die extends JPanel {
private Color circleColor = Color.BLACK;
private int circX = 75;
private int circY = circX;
private int circW = 75;
private int circH = circW;
protected void paintComponent(Graphics g) {
Graphics2D g2 = (Graphics2D) g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2.setColor(circleColor);
g2.fillOval(circX, circY, circW, circH);
g2.setColor(circleColor);
g2.drawOval(circX, circY, circW, circH);
Graphics2D g3 = (Graphics2D) g;
g3.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g3.setColor(circleColor);
g3.fillOval(600, circY, circW, circH);
g3.setColor(circleColor);
g3.drawOval(600, circY, circW, circH);
Graphics2D g4 = (Graphics2D) g;
g4.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g4.setColor(circleColor);
g4.fillOval(600, 325, circW, circH);
g4.setColor(circleColor);
g4.drawOval(600, 325, circW, circH);
Graphics2D g5 = (Graphics2D) g;
g5.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g5.setColor(circleColor);
g5.fillOval(600, 600, circW, circH);
g5.setColor(circleColor);
g5.drawOval(600, 600, circW, circH);
Graphics2D g6 = (Graphics2D) g;
g6.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g6.setColor(circleColor);
g6.fillOval(circX, 325, circW, circH);
g6.setColor(circleColor);
g6.drawOval(circX, 325, circW, circH);
Graphics2D g7 = (Graphics2D) g;
g7.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g7.setColor(circleColor);
g7.fillOval(circX, 600, circW, circH);
g7.setColor(circleColor);
g7.drawOval(circX, 600, circW, circH);
Graphics2D g8 = (Graphics2D) g;
g8.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g8.setColor(circleColor);
g8.fillOval(325, 325, circW, circH);
g8.setColor(circleColor);
g8.drawOval(325, 325, circW, circH);
//1 = g8
//2 = g2, g5
//3 = g7, g3, g8
//4 = g2, g3, g7, g5
//5 = g2, g3, g8, g7, g5
//6 = g2, g3, g4, g5, g6, g7
}
private static void createAndShowGui() {
JFrame frame = new JFrame("Die Roller");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.getContentPane().add(new Die());
JButton b1 = new JButton("Roll");
frame.setSize(800, 800);
frame.setVisible(true);
}
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
public void run() {
createAndShowGui();
}
});
}
}
to do code splitting on the client-side but don't want to have code splitting when I compile my server-side code. Here is my webpack config:
require.ensureWhen I run it, I get server.js, 1.server.js, 2.server.js, etc. I'd rather just have a single server.js file.
At the top of each route file I have:
{
entry: path.join(__dirname, '../server/app.js'),
target: 'node',
output: {
path: './',
filename: 'server.js'
},
module: {
loaders: [
{ test: /\.js$/, loader: 'babel', exclude: /node_modules/ },
{ test: /\.hbs$/, loader: 'handlebars-loader', include: /client/ }
]
},
externals: nodeModules
}
Which works when I use if (typeof require.ensure !== 'function') require.ensure = (d, c) => c(require);
in development, but I'd rather have a compiled file for production.
答案 0 :(得分：7)
I've addressed this with conditionals around the require. If it's a browser build, require.ensure, if it's a server build, just require. I use the DefinePlugin to define 'constant' variables for the environment for each build, so it would look something like
cityWebpack's static analysis is only smart enough to understand boolean values, so doing something like if (BUILD_BROWSER) {
require.ensure('foo.js', function() { ... });
} else {
require('foo.js');
...
}
won't work; the parser won't follow the logic and will process both requires.
If you're using the Uglify plugin, that will strip out the unneeded conditional logic so you don't bloat your production build.