You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
@@ -18,9 +18,9 @@ The solution contained in this project with work with **NodeJS 4.0.0**. It is mo
18
18
19
19
* This package is **not** a global installation. You need to install as a [development dependency](https://docs.npmjs.com/files/package.json#devdependencies) in every single project you wish to build.
20
20
21
-
* This package does **not** contain [Karma](http://karma-runner.github.io/) and does not support Unit Testing without other pre-requisites (see below).
21
+
* This package does **not** contain [Karma](http://karma-runner.github.io/) and does not support Unit Testing without other co-requisites (see below).
22
22
23
-
* This package does **not** contain the [Webpack CLI](https://github.com/webpack/docs/wiki/cli), you will need to install separately (see below).
23
+
* This package presumes [npm scripts](https://docs.npmjs.com/misc/scripts). If you want to run outside of scripts you will need some additional global installs (see below).
*Install [Webpack CLI](https://github.com/webpack/docs/wiki/cli) as a **global**package using NPM.
50
+
Install [karma-angularity-solution](https://github.com/angularity/karma-angularity-solution) as a **local dev-dependency**if you expect to be running Unit Tests.
51
51
52
-
```
53
-
npm install -g webpack
54
-
```
55
-
56
-
* Install [cross-env](https://www.npmjs.com/package/cross-env) as a **global** package using NPM, to allow you to write environment variables from your [NPM scripts](https://docs.npmjs.com/misc/scripts).
57
-
58
-
```
59
-
npm install -g cross-env
60
-
```
52
+
```
53
+
npm install --save-dev karma-angularity-solution
54
+
```
61
55
62
-
* Install [karma-angularity-solution](https://github.com/angularity/karma-angularity-solution) as a **local dev-dependency** if you expect to be running Unit Tests.
56
+
Note that you do **not** need any global installs if you only use [npm scripts](https://docs.npmjs.com/misc/scripts). But if you operate outside of npm scripts you will find that you are missing [Webpack CLI](https://github.com/webpack/docs/wiki/cli), and [cross-env](https://www.npmjs.com/package/cross-env) as global installs.
63
57
64
-
```
65
-
npm install --save-dev karma-angularity-solution
66
-
```
67
58
68
59
### Each project
69
60
@@ -74,56 +65,82 @@ Please read in full. Failure to configure any one of the following may leave you
74
65
Use the following dev-dependencies and scripts in your project.
You may be able to omit the babel dependencies if you have not been writing ES6 javascript.
84
+
Some explanation:
92
85
93
-
Also don't forget to change **`MYPROJECT`** prefix to the name of your project to avoid environment variable crosstalk.
86
+
***BabelJS**
94
87
95
-
#### `webpack.conf.js`
88
+
You may be able to omit the [BabelJS](https://babeljs.io/) dependencies if you have not been writing ES6 javascript.
89
+
90
+
***cross-env**
91
+
92
+
Any setting passed to `cross-env` corresponds to environment variables. By convention they are `UPPERCASE`. These environment variables are private to the executable that follows so you don't need to worry about name conflicts across different projects.
93
+
94
+
#### `webpack.config.js`
96
95
97
96
Create a Webpack configuration file that delegates to the `webpack-angularity-solution` package. Use options taken from the same environment variables used in your `package.json` scripts.
Note that there are **no globals** in applications bundled by Webpack. If your code relies on globals such as jQuery, you will have to configure the `provide` option as shown above. Add additional globals as required by your application.
115
+
Some explanation:
116
+
117
+
***Options by `process.env`**
118
+
119
+
In the example you can see that more than one configuration may be passed to `angularity()`. This means `process.env` may be passed in entirety.
120
+
121
+
Angularity will automatically convert any upper-case option `SOME_OPTION` to camel-case `someOption` and parse strings to the correct type.
122
+
123
+
***Option `globals`**
124
+
125
+
Note that there are **no globals** in applications bundled by Webpack. If your code relies on globals such as jQuery, you will have to configure the `globals` option as shown above.
126
+
127
+
Add additional globals as required by your application.
128
+
129
+
***The `resolve()` method**
130
+
131
+
This is pro-forma. Refer to the section on **extensability** for more detail.
132
+
133
+
Suffice to say that valid values of the `MODE` are `app`|`test`|`release`. Omission of `MODE` implies both `app` and `test` compilations.
117
134
118
135
#### `.babelrc`
119
136
120
-
If you are **compiling future Javascript** down to to current javascript you will need to configure **BabelJS** with the particulars.
137
+
If you are **compiling future Javascript** down to to current javascript you will need to configure [BabelJS](https://babeljs.io/) with the particulars.
121
138
122
-
Angularity has traditionally supported ES6 (now es2015) so we will use that as an example. Also note that the Babel `default export` behaviour has changed so we will be use [babel-plugin-add-module-exports](https://www.npmjs.com/package/babel-plugin-add-module-exports)to retain the previous syntax.
139
+
Angularity has traditionally supported ES6 (now es2015) so we will use that as an example. Also note that the Babel `default export` behaviour has changed so we will be use [babel-plugin-add-module-exports](https://www.npmjs.com/package/babel-plugin-add-module-exports)so that `require()` statements yeild the default export.
123
140
124
141
Both of these aspects were installed above as `devDependencies` so we can now create a babel-js [configuration file](https://babeljs.io/docs/usage/babelrc/) that uses them.
125
142
126
-
```
143
+
```json
127
144
{
128
145
"presets": [
129
146
"es2015"
@@ -144,16 +161,57 @@ For example:
144
161
145
162
* run a watch using `npm run watch`
146
163
164
+
* run release build using `npm run release`
165
+
147
166
### Options
167
+
168
+
#### General settings
169
+
170
+
```javascript
171
+
port :55555, // port to serve during watch
172
+
unminified:false, // switch to unminified
173
+
publicPath:undefined, // CDN path for release builds
174
+
globals : {} // A hash of packages keyed by their global variable
175
+
```
176
+
177
+
Note that if you have an `angularity.json` file then its `port` property will be used as the default value, rather than `55555`.
178
+
179
+
#### Full customisation
180
+
181
+
These settings deviate from the Angularity standard project structure
182
+
183
+
```javascript
184
+
appDir :'./app', // your composition roots
185
+
buildDir :'./app-build', // output of the app build
186
+
testDir :'./app-test', // output of the test build
187
+
releaseDir:'./app-release', // output of the release build
188
+
testGlob :'**/*.spec.js'// identify your test files
189
+
```
190
+
191
+
## Extensability
192
+
193
+
The result of `angularity()` is an instance with a number of accessors: `app`, `test`, `release`. Each accessor returns a [`webpack-configurator`](https://www.npmjs.com/package/webpack-configurator) or Array thereof.
194
+
195
+
The `webpack-configurator` instance(s) provide methods for extensibility of the configuration but is not a webpack configuration until `configurator.resolve()` is called. This is done automatically by the `angularity.resolve()` method, negating the need to iterate over the configurator instance(s).
0 commit comments