Skip to content

Commit 044cc62

Browse files
andrelmlinsandrelmlins
authored
Merge pull request #4 from andrelmlins/feature/build-app
Feature/build app
2 parents 56eed83 + 980e973 commit 044cc62

File tree

10 files changed

+158
-58
lines changed

10 files changed

+158
-58
lines changed

‎docs/docs/scripsts.md‎ renamed to ‎docs/docs/scripts.md‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ title: Scripts
44
sidebar_label: Scripts
55
---
66

7-
## Start the project
7+
## Start the development application
88

99
Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`.
1010

@@ -14,7 +14,7 @@ npm start
1414
yarn start
1515
```
1616

17-
## Build the project
17+
## Build the library
1818

1919
Using [babel](https://babeljs.io/) with reference to folder `src/lib`.
2020

@@ -24,6 +24,16 @@ npm build
2424
yarn build
2525
```
2626

27+
## Build the developmento application
28+
29+
Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`.
30+
31+
```
32+
npm build:app
33+
// OR
34+
yarn build:app
35+
```
36+
2737
## Test the project
2838

2939
Using [jest](https://jestjs.io/) with reference to folder `src/lib`. Is possible edit the test config in `package.json`.

‎lerna.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,5 @@
22
"packages": ["packages/*"],
33
"useWorkspaces": true,
44
"npmClient": "yarn",
5-
"version": "0.5.1"
5+
"version": "0.6.0"
66
}

‎packages/create-react-dependency/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "create-react-dependency",
3-
"version": "0.5.1",
3+
"version": "0.6.0",
44
"description": "Creating react libraries",
55
"main": "index.js",
66
"author": "André Lins <[email protected]> (https://andrelmlins.github.io/)",

‎packages/create-react-dependency/stages/createPackageJson.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,13 @@ const createPackageJson = (root, name) => {
1414
scripts: {
1515
start: 'react-dependency-scripts start',
1616
build: 'react-dependency-scripts build',
17+
'build:app': 'react-dependency-scripts build-app',
1718
test: 'react-dependency-scripts test'
1819
},
1920
devDependencies: {
2021
react: '^16.12.0',
2122
'react-dom': '^16.12.0',
22-
'react-dependency-scripts': '^0.5.1'
23+
'react-dependency-scripts': '^0.6.0'
2324
},
2425
browserslist: {
2526
production: ['>0.2%', 'not dead', 'not op_mini all'],

‎packages/react-dependency-scripts/README.md‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
[![npm version](https://badge.fury.io/js/react-dependency-scripts.svg)](https://www.npmjs.com/package/react-dependency-scripts)
44

5-
## Start the project
5+
## Start the development application
66

77
Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`.
88

@@ -12,7 +12,7 @@ npm start
1212
yarn start
1313
```
1414

15-
## Build the project
15+
## Build the library
1616

1717
Using [babel](https://babeljs.io/) with reference to folder `src/lib`.
1818

@@ -22,6 +22,16 @@ npm build
2222
yarn build
2323
```
2424

25+
## Build the developmento application
26+
27+
Using [webpack](https://webpack.js.org/) with reference to folder `src/dev`.
28+
29+
```
30+
npm build:app
31+
// OR
32+
yarn build:app
33+
```
34+
2535
## Test the project
2636

2737
Using [jest](https://jestjs.io/) with reference to folder `src/lib`. Is possible edit the test config in `package.json`.

‎packages/react-dependency-scripts/configs/webpack.config.js‎

Lines changed: 95 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,102 @@
1-
"use strict";
1+
'use strict';
22

3-
const HtmlWebpackPlugin = require("html-webpack-plugin");
4-
const resolverPath = require("../utils/resolverPath");
3+
const HtmlWebpackPlugin = require('html-webpack-plugin');
4+
const resolverPath = require('../utils/resolverPath');
55

6-
const APP_PATH = resolverPath("src/dev");
6+
const APP_PATH = resolverPath('src/dev');
7+
const BUILD_PATH = resolverPath('build');
78

8-
const config = {
9-
entry: APP_PATH,
10-
mode: "development",
11-
resolve: {
12-
modules: ["node_modules", "src/lib"],
13-
extensions: [".ts", ".tsx", ".js", ".json"]
14-
},
15-
module: {
16-
rules: [
17-
{
18-
test: /\.(ts|js)x?$/,
19-
loader: "babel-loader",
20-
exclude: /node_modules/,
21-
options: {
22-
presets: [require.resolve("babel-preset-react-app")]
23-
}
24-
},
25-
{
26-
test: /\.(gif|png|jpe?g|svg)$/i,
27-
use: [
28-
"file-loader",
29-
{
30-
loader: "image-webpack-loader"
9+
const configWebpack = ({ mode }) => {
10+
const isEnvProduction = mode === 'production';
11+
12+
return {
13+
entry: APP_PATH,
14+
output: {
15+
path: BUILD_PATH,
16+
pathinfo: !isEnvProduction,
17+
filename: isEnvProduction
18+
? 'static/js/[name].[contenthash:8].js'
19+
: 'bundle.js',
20+
chunkFilename: isEnvProduction
21+
? 'static/js/[name].[contenthash:8].chunk.js'
22+
: 'static/js/[name].chunk.js',
23+
globalObject: 'this'
24+
},
25+
mode,
26+
bail: isEnvProduction,
27+
resolve: {
28+
modules: [
29+
'node_modules',
30+
resolverPath('node_modules'),
31+
resolverPath('src')
32+
],
33+
extensions: ['.ts', '.tsx', '.js', '.json']
34+
},
35+
module: {
36+
rules: [
37+
{
38+
test: /\.(ts|js)x?$/,
39+
loader: require.resolve('babel-loader'),
40+
exclude: /node_modules/,
41+
options: {
42+
babelrc: false,
43+
configFile: false,
44+
compact: isEnvProduction,
45+
sourceMaps: false,
46+
inputSourceMap: false,
47+
presets: [require.resolve('babel-preset-react-app')]
3148
}
32-
]
33-
},
34-
{
35-
test: /\.scss$/,
36-
use: ["style-loader", "css-loader", "sass-loader"]
37-
},
38-
{
39-
test: /\.css$/,
40-
use: ["style-loader", "css-loader"]
41-
}
49+
},
50+
{
51+
test: /\.(gif|png|jpe?g|svg)$/i,
52+
use: ['file-loader', { loader: 'image-webpack-loader' }]
53+
},
54+
{
55+
test: /\.scss$/,
56+
use: ['style-loader', 'css-loader', 'sass-loader']
57+
},
58+
{
59+
test: /\.css$/,
60+
use: ['style-loader', 'css-loader']
61+
}
62+
]
63+
},
64+
optimization: { minimize: isEnvProduction },
65+
node: {
66+
module: 'empty',
67+
dgram: 'empty',
68+
dns: 'mock',
69+
fs: 'empty',
70+
http2: 'empty',
71+
net: 'empty',
72+
tls: 'empty',
73+
child_process: 'empty'
74+
},
75+
plugins: [
76+
new HtmlWebpackPlugin(
77+
Object.assign(
78+
{},
79+
{ inject: true, template: `${APP_PATH}/index.html` },
80+
isEnvProduction
81+
? {
82+
minify: {
83+
removeComments: true,
84+
collapseWhitespace: true,
85+
removeRedundantAttributes: true,
86+
useShortDoctype: true,
87+
removeEmptyAttributes: true,
88+
removeStyleLinkTypeAttributes: true,
89+
keepClosingSlash: true,
90+
minifyJS: true,
91+
minifyCSS: true,
92+
minifyURLs: true
93+
}
94+
}
95+
: undefined
96+
)
97+
)
4298
]
43-
},
44-
45-
plugins: [
46-
new HtmlWebpackPlugin({
47-
inject: true,
48-
template: `${APP_PATH}/index.html`
49-
})
50-
],
51-
52-
optimization: { minimize: false }
99+
};
53100
};
54101

55-
module.exports = config;
102+
module.exports = configWebpack;

‎packages/react-dependency-scripts/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ process.on('unhandledRejection', err => {
99
const { spawnSync } = require('child_process');
1010

1111
const args = process.argv.slice(2);
12-
const scripts = ['start', 'build', 'test'];
12+
const scripts = ['start', 'build', 'test', 'build-app'];
1313

1414
if (args.length === 0) {
1515
console.log('\x1b[31mEmpty script.');

‎packages/react-dependency-scripts/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-dependency-scripts",
3-
"version": "0.5.1",
3+
"version": "0.6.0",
44
"description": "Scripts of react libraries",
55
"main": "index.js",
66
"author": "André Lins <[email protected]> (https://andrelmlins.github.io/)",
@@ -36,6 +36,7 @@
3636
"choose-port": "^0.1.0",
3737
"css-loader": "^3.4.2",
3838
"file-loader": "^5.0.2",
39+
"fs-extra": "^8.1.0",
3940
"html-webpack-plugin": "^3.2.0",
4041
"image-webpack-loader": "^6.0.0",
4142
"jest": "^25.1.0",

‎packages/react-dependency-scripts/scripts/build-app.js‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
'use strict';
2+
3+
process.env.NODE_ENV = 'production';
4+
process.env.BABEL_ENV = 'production';
5+
6+
const Webpack = require('webpack');
7+
const fs = require('fs-extra');
8+
const resolverPath = require('../utils/resolverPath');
9+
const configWebpack = require('../configs/webpack.config.js');
10+
11+
const BUILD_PATH = resolverPath('build');
12+
13+
const config = configWebpack({
14+
mode: 'production'
15+
});
16+
17+
fs.emptyDirSync(BUILD_PATH);
18+
19+
const compiler = Webpack(config);
20+
21+
compiler.run((err, stats) => {
22+
if (err) {
23+
return console.log(err);
24+
}
25+
26+
return console.log(stats);
27+
});

‎packages/react-dependency-scripts/scripts/start.js‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,16 @@ process.on('unhandledRejection', err => {
1010
const Webpack = require('webpack');
1111
const WebpackDevServer = require('webpack-dev-server');
1212
const open = require('open');
13-
const config = require('../configs/webpack.config.js');
13+
const configWebpack = require('../configs/webpack.config.js');
1414
const resolverPath = require('../utils/resolverPath');
1515
const choosePort = require('choose-port');
1616

1717
const APP_PATH = resolverPath('src/dev');
1818

19+
const config = configWebpack({
20+
mode: 'development'
21+
});
22+
1923
const compiler = Webpack(config);
2024
const server = new WebpackDevServer(compiler, {
2125
contentBase: APP_PATH,

0 commit comments

Comments
 (0)