Skip to content

Commit 0087df9

Browse files
cvalenzuelacvalenzuela
authored
Merge pull request #136 from oveddan/webpack-build
adding sourcemaps so that ml5.js is more readable.
2 parents f35dcad + 8945ab0 commit 0087df9

File tree

8 files changed

+11772
-115
lines changed

8 files changed

+11772
-115
lines changed

‎CONTRIBUTING.md‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,14 @@ npm install
2626

2727
Run this command from the root of the project:
2828
```bash
29-
npm run start:dev
29+
npm run start
3030
```
3131

3232
Will output something like this:
3333

3434
```bash
3535
Project is running at http://localhost:8080/
36-
webpack output is served from /dist/
36+
webpack output is served from /
3737

3838
Hash: 16b80528bf532975b279
3939
Version: webpack 2.6.1
@@ -71,7 +71,7 @@ Create a new folder called `/experiments` in the project's root folder. Create a
7171
<html>
7272
<head>
7373
<title>Test</title>
74-
<script src="../../dist/ml5.js"></script>
74+
<script src="http://localhost:8080/ml5.js"></script>
7575
</head>
7676
<body>
7777

@@ -109,11 +109,11 @@ Create a new folder called `/experiments` in the project's root folder. Create a
109109
That should output something very similar to the `webpack-dev-server` but you'll notice that at the end is this line:
110110

111111
```bash
112-
> [email protected] build:min /Users/ml5/Desktop/sandbox/ml5
113-
> uglifyjs dist/ml5.js -o dist/ml5.min.js
112+
> webpack --config webpack.prod.babel.js
113+
> Done in 15.13s.
114114
```
115115

116-
Which means the library was successfully build and minified.
116+
Which means the library was successfully built and minified.
117117

118118
6. (OPTIONAL) Commit your changes. We are using [commitizen](https://github.com/commitizen/cz-cli) to commit changes. Commitizen is a tool that allows you to specify commit in a more precise way. You can run it instead of your regular `git commit -m 'msg'` with:
119119

‎dist/ml5.js‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎package.json‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,8 @@
1010
"scripts": {
1111
"commit": "git-cz",
1212
"prebuild": "rimraf dist",
13-
"start:dev": "webpack-dev-server --mode development --watch-content-base --open",
14-
"build": "npm-run-all build:*",
15-
"build:main": "webpack --output-filename ml5.js",
16-
"build:min": "uglifyjs dist/ml5.js -o dist/ml5.min.js",
13+
"start": "webpack-dev-server --open --config webpack.dev.babel.js",
14+
"build": "webpack --config webpack.prod.babel.js",
1715
"test:dev": "./node_modules/karma/bin/karma start karma.conf.js",
1816
"test": "./node_modules/karma/bin/karma start karma.conf.js --no-auto-watch --single-run"
1917
},
@@ -34,11 +32,10 @@
3432
"babel-cli": "6.26.0",
3533
"babel-core": "6.26.0",
3634
"babel-loader": "7.1.4",
37-
"babel-plugin-transform-async-to-generator": "6.24.1",
35+
"babel-plugin-transform-object-rest-spread": "^6.26.0",
36+
"babel-plugin-transform-runtime": "^6.23.0",
3837
"babel-polyfill": "6.26.0",
3938
"babel-preset-env": "1.6.1",
40-
"babel-preset-es2015": "6.24.1",
41-
"babel-preset-stage-2": "6.24.1",
4239
"babel-register": "6.26.0",
4340
"commitizen": "2.9.6",
4441
"cz-conventional-changelog": "2.1.0",
@@ -48,6 +45,7 @@
4845
"eslint-plugin-import": "2.9.0",
4946
"extract-text-webpack-plugin": "4.0.0-beta.0",
5047
"ghooks": "2.0.2",
48+
"html-webpack-plugin": "^3.0.7",
5149
"jasmine-core": "3.1.0",
5250
"karma": "2.0.0",
5351
"karma-chrome-launcher": "2.2.0",
@@ -59,10 +57,11 @@
5957
"regenerator-runtime": "0.11.1",
6058
"rimraf": "2.6.2",
6159
"semantic-release": "15.0.2",
62-
"uglify-es": "3.3.9",
60+
"uglifyjs-webpack-plugin": "^1.2.5",
6361
"webpack": "4.1.1",
6462
"webpack-cli": "2.0.10",
65-
"webpack-dev-server": "3.1.0"
63+
"webpack-dev-server": "3.1.0",
64+
"webpack-merge": "^4.1.2"
6665
},
6766
"config": {
6867
"commitizen": {
@@ -75,16 +74,17 @@
7574
],
7675
"babel": {
7776
"presets": [
78-
"env",
79-
"es2015",
80-
"stage-2"
77+
[
78+
"env"
79+
]
8180
],
8281
"plugins": [
83-
"transform-async-to-generator"
82+
"transform-runtime",
83+
"transform-object-rest-spread"
8484
]
8585
},
8686
"dependencies": {
87-
"@tensorflow-models/posenet": "0.0.1",
87+
"@tensorflow-models/posenet": "^0.1.1",
8888
"@tensorflow/tfjs": "0.11.4"
8989
}
9090
}

‎webpack.config.babel.js‎ renamed to ‎webpack.common.babel.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,16 @@
33
// This software is released under the MIT License.
44
// https://opensource.org/licenses/MIT
55

6-
import { join } from 'path';
6+
import { join, resolve } from 'path';
77

88
const include = join(__dirname, 'src');
99

1010
export default {
1111
entry: ['babel-polyfill', './src/index.js'],
1212
output: {
13-
path: join(__dirname, 'dist'),
13+
path: resolve(__dirname, 'dist'),
14+
publicPath: '/',
1415
libraryTarget: 'umd',
15-
publicPath: '/dist/',
1616
filename: 'ml5.js',
1717
library: 'ml5',
1818
},
@@ -30,5 +30,5 @@ export default {
3030
include,
3131
},
3232
],
33-
},
33+
}
3434
};

‎webpack.dev.babel.js‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
// Copyright (c) 2018 ml5
2+
//
3+
// This software is released under the MIT License.
4+
// https://opensource.org/licenses/MIT
5+
6+
import { join } from 'path';
7+
import merge from 'webpack-merge';
8+
import common from './webpack.common.babel';
9+
import HtmlWebpackPlugin from 'html-webpack-plugin';
10+
11+
export default merge(common, {
12+
mode: 'development',
13+
devtool: 'inline-source-map',
14+
devServer: {
15+
watchContentBase: true,
16+
contentBase: join(__dirname, './dist')
17+
},
18+
plugins: [
19+
new HtmlWebpackPlugin({
20+
title: 'ml5'
21+
})
22+
]
23+
})

‎webpack.prod.babel.js‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
// Copyright (c) 2018 ml5
2+
//
3+
// This software is released under the MIT License.
4+
// https://opensource.org/licenses/MIT
5+
6+
import merge from 'webpack-merge';
7+
import common from './webpack.common.babel';
8+
import UglifyJSPlugin from 'uglifyjs-webpack-plugin';
9+
10+
export default merge(common, {
11+
mode: 'production',
12+
devtool: 'source-map',
13+
output: {
14+
filename: 'ml5.min.js'
15+
},
16+
plugins: [
17+
new UglifyJSPlugin({
18+
sourceMap: true
19+
})
20+
]
21+
})

0 commit comments

Comments
 (0)