Skip to content

Commit 29d240c

Browse files
author
Ankith Konda
committed
Allow for webpack to build two projects in one watch
1 parent e36f91b commit 29d240c

File tree

9 files changed

+632
-52
lines changed

9 files changed

+632
-52
lines changed

admin/build/bundle.js

Lines changed: 379 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

admin/index.php

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Admin Page</title>
6+
7+
</head>
8+
<body>
9+
<div id="app"></div>
10+
<script type="text/javascript" src="./build/bundle.js"></script>
11+
</body>
12+
</html>

admin/src/Components/App.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import React, { Component } from 'react'
2+
import { clearFix } from 'polished'
3+
import PropTypes from 'prop-types'
4+
import styled, {css} from 'styled-components'
5+
import uuid from 'uuid'
6+
7+
const Container = styled.div`
8+
width:100%;
9+
background-color:#FFFAD0;
10+
${ clearFix() }
11+
`
12+
13+
export default class App extends Component{
14+
render(){
15+
return(<Container>
16+
This is a component for App WOOOOAHH
17+
18+
</Container>)
19+
}
20+
}
21+
22+
App.PropTypes = {
23+
24+
}
25+
26+
App.defaultProps = {
27+
28+
}

admin/src/index.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from "react"
2+
import ReactDOM from "react-dom"
3+
4+
import App from "./Components/App"
5+
6+
const appContainer = document.getElementById('app');
7+
let state = {
8+
input_val:"Welcome to React App with PHP API m",
9+
api_message:"",
10+
}
11+
ReactDOM.render(<App appState={state}/>, appContainer);
12+
13+

package-lock.json

Lines changed: 79 additions & 17 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@
3333
"babel-plugin-transform-class-properties": "^6.23.0",
3434
"babel-plugin-transform-decorators-legacy": "^1.3.4",
3535
"babel-preset-env": "^1.6.0",
36+
"babel-preset-latest": "^6.24.1",
3637
"babel-preset-react": "^6.23.0",
3738
"babel-preset-stage-0": "^6.22.0",
3839
"browser-sync": "^2.18.8",

src/Components/App.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export default class App extends React.Component {
3131

3232
}
3333
componentDidMount(){
34-
console.log("Layout component did mount");
34+
console.log("Layout component did mount d");
3535

3636
axios.get('../public/api/api.php', {
3737
params: {
@@ -66,7 +66,7 @@ export default class App extends React.Component {
6666

6767
let LTI_Message = "Oh No LTI is not valid"
6868
if($LTI_is_valid){
69-
LTI_Message = <span>{"LTI is valid and a custom LTI varible is now available in the gloabal scope - "+$LTI_custom_variable_by_user_string}</span>;
69+
LTI_Message = <span>{"LTI is valid and a custom LTI xezw varible is now available in the gloabal scope - "+$LTI_custom_variable_by_user_string}</span>;
7070
}
7171

7272

webpack-production.config.js

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,16 @@ var webpack = require("webpack");
44
var webpackConfig = require('./webpack.config.js');
55

66
//webpackConfig.devtool = "";
7-
// strip out console.log statements
8-
webpackConfig.module.loaders.push({
9-
test: /\.js$/,
10-
exclude: /node_modules/,
11-
loader: 'strip-loader?strip[]=console.log'
12-
});
13-
14-
module.exports = webpackConfig;
7+
// strip out //console.log statements
8+
webpackConfig.forEach(function(object, index){
9+
10+
object.devtool = false;
11+
object.module.loaders.push({
12+
test: /\.js$/,
13+
exclude: /node_modules/,
14+
loader: 'strip-loader?strip[]=//console.log'
15+
});
16+
17+
})
18+
19+
module.exports = webpackConfig;

webpack.config.js

Lines changed: 105 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -4,39 +4,114 @@ var BrowserSyncPlugin = require('browser-sync-webpack-plugin');
44
var path = require('path');
55
var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
66

7-
module.exports = {
7+
var browserSyncPlugin = new BrowserSyncPlugin({
8+
// use existing Apache virtual host
9+
proxy: 'http://localhost:80/',
10+
tunnel: false,
11+
// watch the built files and the index file
12+
files: [
13+
'./public/build/*',
14+
'./public/index.php',
15+
'./public/api/*.php',
16+
'./admin/index.php',
17+
'./admin/src/index.js',
18+
'./admin/build/*'
19+
]
20+
});
21+
22+
var plugins = [
23+
new webpack.LoaderOptionsPlugin({
24+
debug:true,
25+
}),
26+
27+
browserSyncPlugin,
28+
29+
new webpack.ProvidePlugin({
30+
//jQuery : 'jquery',
31+
//$ : 'jquery',
32+
//jquery : 'jquery',
33+
_ : 'lodash'
34+
}),
35+
36+
//new BundleAnalyzerPlugin()
37+
38+
]
39+
40+
var client = {
841
devtool: "#cheap-module-eval-source-map",
942
entry: "./src/index.js",
1043
output: {
1144
path: path.join(__dirname,"public/build"),
1245
filename:"bundle.js",
1346
publicPath:"build/"
1447
},
15-
plugins: [
16-
17-
new webpack.LoaderOptionsPlugin({
18-
debug:true,
19-
}),
20-
// reloads browser when the watched files change
21-
new BrowserSyncPlugin({
22-
// use existing Apache virtual host
23-
proxy: 'http://localhost:80/',
24-
tunnel: false,
25-
// watch the built files and the index file
26-
files: ['./public/build/*', './public/index.php', './public/api/*.php']
27-
}),
28-
29-
new webpack.ProvidePlugin({
30-
//jQuery : 'jquery',
31-
//$ : 'jquery',
32-
//jquery : 'jquery',
33-
_ : 'lodash'
34-
}),
35-
36-
37-
//new BundleAnalyzerPlugin()
48+
plugins: plugins,
49+
//target: 'node',
50+
//node: {fs: "empty"},
51+
module:{
52+
loaders:[
53+
{
54+
test: /\.js$/,
55+
exclude: /(node_modules)/,
56+
loader: "babel-loader",
57+
query: {
58+
presets: ["env", "stage-0", "react"],
59+
plugins: ["react-html-attrs", "transform-class-properties", "transform-decorators-legacy"]
60+
}
61+
},
62+
{
63+
test: /\.json$/,
64+
exclude: /(node_modules)/,
65+
loader:"json-loader",
66+
},
67+
{
68+
test: /\.scss$/,
69+
exclude: /(node_modules)/,
70+
loader:"style-loader!css-loader!sass-loader"
71+
},
72+
{
73+
test: /\.css$/,
74+
loader: "style-loader!css-loader"
75+
},
76+
{
77+
test: /\.png$/,
78+
loader: "url-loader?limit=100000"
79+
},
80+
{
81+
test: /\.jpg$/,
82+
loader: "file-loader"
83+
},
84+
{
85+
test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
86+
loader: 'url-loader?limit=10000&mimetype=application/font-woff'
87+
},
88+
{
89+
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
90+
loader: 'url-loader?limit=10000&mimetype=application/octet-stream'
91+
},
92+
{
93+
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
94+
loader: 'file-loader'
95+
},
96+
{
97+
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
98+
loader: 'url-loader?limit=10000&mimetype=image/svg+xml'
99+
}
100+
]
101+
}
102+
};
38103

39-
],
104+
var admin = {
105+
devtool: "#cheap-module-eval-source-map",
106+
entry: "./admin/src/index.js",
107+
output: {
108+
path: path.join(__dirname,"admin/build"),
109+
filename:"bundle.js",
110+
publicPath:"admin/build/"
111+
},
112+
plugins: plugins,
113+
//target: 'node',
114+
//node: {fs: "empty"},
40115
module:{
41116
loaders:[
42117
{
@@ -89,3 +164,8 @@ module.exports = {
89164
]
90165
}
91166
};
167+
168+
module.exports = [
169+
client,
170+
admin
171+
];

0 commit comments

Comments
 (0)