@studyportals/webpack-helper 2.5.0-beta.0 → 2.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +201 -201
- package/package.json +59 -58
- package/src/defaults/development.config.js +1 -1
- package/src/defaults/production.config.js +9 -9
- package/src/enums/mode.js +1 -1
- package/src/enums/preset.js +1 -1
- package/src/factories/configuration-factory.js +6 -9
- package/src/interfaces/bob.interface.js +1 -1
- package/src/interfaces/entry.interface.js +1 -1
- package/src/interfaces/entrypoint.interface.js +1 -1
- package/src/interfaces/output.interface.js +1 -1
- package/src/interfaces/preset.interface.js +1 -1
- package/src/main.js +5 -0
- package/src/model/configuration.js +44 -47
- package/src/model/entry.js +6 -7
- package/src/model/module.js +9 -11
- package/src/model/output.js +12 -13
- package/src/model/plugins.js +8 -10
- package/src/presets/javascript.preset.js +13 -16
- package/src/presets/typescript.preset.js +13 -16
- package/src/presets/vue-typescript.preset.js +16 -19
package/README.md
CHANGED
|
@@ -1,201 +1,201 @@
|
|
|
1
|
-
# WebpackHelper
|
|
2
|
-
|
|
3
|
-
WebpackHelper is a utility that makes it easy to set up a webpack configuration for Studyportals' projects that adhere to our [Webpack quality criteria](https://knowledge-vault.studyportals.xyz/quality-standards/front-end/webpack-quality-criteria.html).
|
|
4
|
-
|
|
5
|
-
## Table of Contents
|
|
6
|
-
- [Quick Start](#quick-start)
|
|
7
|
-
- [Configuration](#configuration)
|
|
8
|
-
- [entry](#entry-required)
|
|
9
|
-
- [output](#output-required)
|
|
10
|
-
- [preset](#preset)
|
|
11
|
-
- [bob](#bob)
|
|
12
|
-
- [common](#common)
|
|
13
|
-
- [development](#development)
|
|
14
|
-
- [production](#production)
|
|
15
|
-
- [Presets](#presets)
|
|
16
|
-
- [javascript](#javascript)
|
|
17
|
-
- [typescript](#typescript)
|
|
18
|
-
- [vue-typescript](#vue-typescript)
|
|
19
|
-
- [DoD compliance with Babel and Browserslist](#dod-compliance-with-babel-and-browserslist)
|
|
20
|
-
|
|
21
|
-
## Quick Start
|
|
22
|
-
|
|
23
|
-
```bash
|
|
24
|
-
npm i -D @studyportals/webpack-helper
|
|
25
|
-
```
|
|
26
|
-
|
|
27
|
-
After installation, getting started is quite easy. Just set up a `webpack.config.js` file in the root of your project, require Webpack Helper and set up a configuration using it's `create` method like so:
|
|
28
|
-
|
|
29
|
-
```javascript
|
|
30
|
-
const path = require('path');
|
|
31
|
-
const WebpackHelper = require("@studyportals/webpack-helper");
|
|
32
|
-
|
|
33
|
-
const configuration = WebpackHelper.create({
|
|
34
|
-
entry: [
|
|
35
|
-
"./src/main.ts"
|
|
36
|
-
],
|
|
37
|
-
output: {
|
|
38
|
-
path: path.resolve(__dirname, './dist'),
|
|
39
|
-
fileName: 'bundle',
|
|
40
|
-
hash: true,
|
|
41
|
-
// Use this if you want to control hashing for js and css separately
|
|
42
|
-
hash: {
|
|
43
|
-
js: true,
|
|
44
|
-
css: false
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
preset: "vue-typescript",
|
|
48
|
-
bob: {
|
|
49
|
-
name: 'MicroService',
|
|
50
|
-
html: '<div id=\"MicroServicePlaceholder\"></div>',
|
|
51
|
-
baseURL: '/dist',
|
|
52
|
-
defer: ['style'],
|
|
53
|
-
dllPackages: [
|
|
54
|
-
{
|
|
55
|
-
name: "package-dll",
|
|
56
|
-
manifest: require("@studyportals/package-dll/dist/manifest.json")
|
|
57
|
-
}
|
|
58
|
-
]
|
|
59
|
-
},
|
|
60
|
-
common: {
|
|
61
|
-
//any config
|
|
62
|
-
},
|
|
63
|
-
development: {
|
|
64
|
-
//any config
|
|
65
|
-
},
|
|
66
|
-
production: {
|
|
67
|
-
//any config
|
|
68
|
-
}
|
|
69
|
-
});
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
When your configuration is created you can get an instance of it for the correct environment and export it for webpack to use like so:
|
|
73
|
-
|
|
74
|
-
```javascript
|
|
75
|
-
module.exports = mode => configuration.get(mode);
|
|
76
|
-
```
|
|
77
|
-
## Configuration
|
|
78
|
-
|
|
79
|
-
Webpack Helper offers a compact but flexible configuration interface. Below you will find every option available.
|
|
80
|
-
|
|
81
|
-
### entry **(required)**
|
|
82
|
-
|
|
83
|
-
The entrypoint for your webpack bundle. This can either be configured as an object with the bundle name as a key and the path as a value or as an array of paths if your project requires multiple entry points.
|
|
84
|
-
|
|
85
|
-
```javascript
|
|
86
|
-
entry: [
|
|
87
|
-
"./src/main.ts"
|
|
88
|
-
]
|
|
89
|
-
|
|
90
|
-
//or
|
|
91
|
-
|
|
92
|
-
entry: {
|
|
93
|
-
bundle: "./src/main.ts"
|
|
94
|
-
}
|
|
95
|
-
```
|
|
96
|
-
|
|
97
|
-
### output **(required)**
|
|
98
|
-
|
|
99
|
-
The output object has some options that define how your bundle will be output. It has the following properties:
|
|
100
|
-
|
|
101
|
-
- `path`**(required)**: The target directory for all output files.
|
|
102
|
-
- `library`: The name of the exported library, which will also be used to namespace sourcemaps. This will default to `null`.
|
|
103
|
-
- `publicPath`: The url to the output directory resolved relative to the HTML page. This will default to `null`.
|
|
104
|
-
- `fileName`: A custom filename for your bundle. This will default to `[name]` which refers to the name you've given your entrypoint.
|
|
105
|
-
- `hash`: Whether or not to add build hashes to your filenames. This will default to `true`. Whenever you want different values for your js and css you can pass an object with separate properties and values as in the example below.
|
|
106
|
-
- `crossOriginLoading`: Tells webpack to enable cross-origin loading of chunks. Can either be set to `anonymous` or `user-credentials`.
|
|
107
|
-
|
|
108
|
-
```javascript
|
|
109
|
-
output: {
|
|
110
|
-
path: path.resolve(__dirname, './dist'),
|
|
111
|
-
library: 'test-microservice',
|
|
112
|
-
publicPath: '/assets/',
|
|
113
|
-
fileName: 'application',
|
|
114
|
-
crossOriginLoading: 'anonymous',
|
|
115
|
-
hash: false,
|
|
116
|
-
//or
|
|
117
|
-
hash: {
|
|
118
|
-
js: true,
|
|
119
|
-
css: false
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
```
|
|
123
|
-
|
|
124
|
-
### preset
|
|
125
|
-
|
|
126
|
-
The preset property determines which preset to load into your webpack configuration.
|
|
127
|
-
|
|
128
|
-
```javascript
|
|
129
|
-
preset: "vue-typescript | typescript | javascript"
|
|
130
|
-
```
|
|
131
|
-
|
|
132
|
-
### bob
|
|
133
|
-
|
|
134
|
-
The bob object adds all necessary configuration to have your project generate a manifest file to be used by [Bob](https://github.com/studyportals/Bob).
|
|
135
|
-
|
|
136
|
-
- `name`**(required)**: The name of your microservice.
|
|
137
|
-
- `html`**(required)**: The HTML that needs to be output by your microservice. Can be a path to a document or a snippet.
|
|
138
|
-
- `baseURL`: The baseURL for your microservice assets.
|
|
139
|
-
- `async`: An array of JS filenames to be loaded async.
|
|
140
|
-
- `defer`: An array of CSS filenames to be lazy-loaded.
|
|
141
|
-
- `exclude`: An array of filenames (CSS and JS) that should be excluded from your manifest file.
|
|
142
|
-
- `dllPackages`: An array of objects that reference your Dll dependencies. They all require a name and a Dll manifest in the form of a json file.
|
|
143
|
-
|
|
144
|
-
```javascript
|
|
145
|
-
bob: {
|
|
146
|
-
name: 'MicroService',
|
|
147
|
-
html: '<div id=\"MicroServicePlaceholder\"></div>',
|
|
148
|
-
baseURL: '/dist',
|
|
149
|
-
defer: ['style'],
|
|
150
|
-
exclude: ['demo-assets'],
|
|
151
|
-
dllPackages: [
|
|
152
|
-
{
|
|
153
|
-
name: "package-dll",
|
|
154
|
-
manifest: require("@studyportals/package-dll/dist/manifest.json")
|
|
155
|
-
}
|
|
156
|
-
]
|
|
157
|
-
}
|
|
158
|
-
```
|
|
159
|
-
|
|
160
|
-
WebpackHelper uses [BobManifestGenerator](https://github.com/studyportals/BobManifestGenerator) to generate a manifest file.
|
|
161
|
-
|
|
162
|
-
### common
|
|
163
|
-
|
|
164
|
-
Extra Webpack configuration to be used for all environments can be passed in the `common` object. This configuration needs to adhere to Webpack's configuration interface and will be merged in with the other configuration through [webpack-merge](https://github.com/survivejs/webpack-merge).
|
|
165
|
-
|
|
166
|
-
### development
|
|
167
|
-
|
|
168
|
-
Extra Webpack configuration to be used for all development builds can be passed in the `development` object. This configuration needs to adhere to Webpack's configuration interface and will be merged in with the other configuration through [webpack-merge](https://github.com/survivejs/webpack-merge).
|
|
169
|
-
|
|
170
|
-
**NOTE**: Some default configuration for development builds will be added automatically. Details can be found [here](src/defaults/defaults.md).
|
|
171
|
-
|
|
172
|
-
### production
|
|
173
|
-
|
|
174
|
-
Extra Webpack configuration to be used for all production builds can be passed in the `production` object. This configuration needs to adhere to Webpack's configuration interface and will be merged in with the other configuration through [webpack-merge](https://github.com/survivejs/webpack-merge).
|
|
175
|
-
|
|
176
|
-
**NOTE**: Some default configuration for production builds will be added automatically. Details can be found [here](src/defaults/defaults.md).
|
|
177
|
-
|
|
178
|
-
## Presets
|
|
179
|
-
|
|
180
|
-
In order to make your life as easy as possible, Webpack Helper ships with a set of presets that will take care of putting some essential plugins and loaders in your configuration. The different presets are listed below.
|
|
181
|
-
|
|
182
|
-
More in depth information on what configuration these presets will add to your project can be found [here](src/presets/presets.md).
|
|
183
|
-
|
|
184
|
-
### javascript
|
|
185
|
-
|
|
186
|
-
The javascript preset will resolve all `.js` and `.json` files and transpiles them with Babel. If your project has styling, it will separate that out in a separate `.css` file.
|
|
187
|
-
|
|
188
|
-
### typescript
|
|
189
|
-
|
|
190
|
-
The typescript preset will resolve all `.ts`, `.tsx`, `.js` and `.json` files. It transpiles them using tsc and Babel. Be aware that you will need to include a `tsconfig.json` in your project for it to work properly. If your project has styling, it will separate that out in a separate `.css` file.
|
|
191
|
-
|
|
192
|
-
### vue-typescript
|
|
193
|
-
|
|
194
|
-
The vue-typescript preset will resolve all `.vue`, `.ts`, `.tsx`, `.js` and `.json` files. It transpiles them using vue-loader, tsc and Babel. Be aware that you will need to include a `tsconfig.json` in your project for it to work properly. If your project has styling, it will separate that out in a separate `.css` file.
|
|
195
|
-
|
|
196
|
-
## DoD compliance with Babel and Browserslist
|
|
197
|
-
|
|
198
|
-
In order to comply to [Studyportals' definition of done](https://knowledge-vault.studyportals.xyz/definitions-of-done/product/) we use `babel` to transpile our front-end code according to the browsers we need to support. To do this your project needs some configuration. When Webpack Helper is installed it will put standard configuration in the root of your project which consists of 2 files:
|
|
199
|
-
|
|
200
|
-
- `.babelrc`: A standard configuration for babel that loads the `babel-env` and `babel-typescripts` presets. You might need to add more plugins for your specific project.
|
|
201
|
-
- `.browserslistrc`: A configuration file for browserslist. This is used by `babel-env` to determine which browsers to transpile the code for. Within this file the configuration for student facing products will be loaded by default but other configurations can be easily loaded by uncommenting some lines.
|
|
1
|
+
# WebpackHelper
|
|
2
|
+
|
|
3
|
+
WebpackHelper is a utility that makes it easy to set up a webpack configuration for Studyportals' projects that adhere to our [Webpack quality criteria](https://knowledge-vault.studyportals.xyz/quality-standards/front-end/webpack-quality-criteria.html).
|
|
4
|
+
|
|
5
|
+
## Table of Contents
|
|
6
|
+
- [Quick Start](#quick-start)
|
|
7
|
+
- [Configuration](#configuration)
|
|
8
|
+
- [entry](#entry-required)
|
|
9
|
+
- [output](#output-required)
|
|
10
|
+
- [preset](#preset)
|
|
11
|
+
- [bob](#bob)
|
|
12
|
+
- [common](#common)
|
|
13
|
+
- [development](#development)
|
|
14
|
+
- [production](#production)
|
|
15
|
+
- [Presets](#presets)
|
|
16
|
+
- [javascript](#javascript)
|
|
17
|
+
- [typescript](#typescript)
|
|
18
|
+
- [vue-typescript](#vue-typescript)
|
|
19
|
+
- [DoD compliance with Babel and Browserslist](#dod-compliance-with-babel-and-browserslist)
|
|
20
|
+
|
|
21
|
+
## Quick Start
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
npm i -D @studyportals/webpack-helper
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
After installation, getting started is quite easy. Just set up a `webpack.config.js` file in the root of your project, require Webpack Helper and set up a configuration using it's `create` method like so:
|
|
28
|
+
|
|
29
|
+
```javascript
|
|
30
|
+
const path = require('path');
|
|
31
|
+
const WebpackHelper = require("@studyportals/webpack-helper");
|
|
32
|
+
|
|
33
|
+
const configuration = WebpackHelper.create({
|
|
34
|
+
entry: [
|
|
35
|
+
"./src/main.ts"
|
|
36
|
+
],
|
|
37
|
+
output: {
|
|
38
|
+
path: path.resolve(__dirname, './dist'),
|
|
39
|
+
fileName: 'bundle',
|
|
40
|
+
hash: true,
|
|
41
|
+
// Use this if you want to control hashing for js and css separately
|
|
42
|
+
hash: {
|
|
43
|
+
js: true,
|
|
44
|
+
css: false
|
|
45
|
+
}
|
|
46
|
+
},
|
|
47
|
+
preset: "vue-typescript",
|
|
48
|
+
bob: {
|
|
49
|
+
name: 'MicroService',
|
|
50
|
+
html: '<div id=\"MicroServicePlaceholder\"></div>',
|
|
51
|
+
baseURL: '/dist',
|
|
52
|
+
defer: ['style'],
|
|
53
|
+
dllPackages: [
|
|
54
|
+
{
|
|
55
|
+
name: "package-dll",
|
|
56
|
+
manifest: require("@studyportals/package-dll/dist/manifest.json")
|
|
57
|
+
}
|
|
58
|
+
]
|
|
59
|
+
},
|
|
60
|
+
common: {
|
|
61
|
+
//any config
|
|
62
|
+
},
|
|
63
|
+
development: {
|
|
64
|
+
//any config
|
|
65
|
+
},
|
|
66
|
+
production: {
|
|
67
|
+
//any config
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
When your configuration is created you can get an instance of it for the correct environment and export it for webpack to use like so:
|
|
73
|
+
|
|
74
|
+
```javascript
|
|
75
|
+
module.exports = mode => configuration.get(mode);
|
|
76
|
+
```
|
|
77
|
+
## Configuration
|
|
78
|
+
|
|
79
|
+
Webpack Helper offers a compact but flexible configuration interface. Below you will find every option available.
|
|
80
|
+
|
|
81
|
+
### entry **(required)**
|
|
82
|
+
|
|
83
|
+
The entrypoint for your webpack bundle. This can either be configured as an object with the bundle name as a key and the path as a value or as an array of paths if your project requires multiple entry points.
|
|
84
|
+
|
|
85
|
+
```javascript
|
|
86
|
+
entry: [
|
|
87
|
+
"./src/main.ts"
|
|
88
|
+
]
|
|
89
|
+
|
|
90
|
+
//or
|
|
91
|
+
|
|
92
|
+
entry: {
|
|
93
|
+
bundle: "./src/main.ts"
|
|
94
|
+
}
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
### output **(required)**
|
|
98
|
+
|
|
99
|
+
The output object has some options that define how your bundle will be output. It has the following properties:
|
|
100
|
+
|
|
101
|
+
- `path`**(required)**: The target directory for all output files.
|
|
102
|
+
- `library`: The name of the exported library, which will also be used to namespace sourcemaps. This will default to `null`.
|
|
103
|
+
- `publicPath`: The url to the output directory resolved relative to the HTML page. This will default to `null`.
|
|
104
|
+
- `fileName`: A custom filename for your bundle. This will default to `[name]` which refers to the name you've given your entrypoint.
|
|
105
|
+
- `hash`: Whether or not to add build hashes to your filenames. This will default to `true`. Whenever you want different values for your js and css you can pass an object with separate properties and values as in the example below.
|
|
106
|
+
- `crossOriginLoading`: Tells webpack to enable cross-origin loading of chunks. Can either be set to `anonymous` or `user-credentials`.
|
|
107
|
+
|
|
108
|
+
```javascript
|
|
109
|
+
output: {
|
|
110
|
+
path: path.resolve(__dirname, './dist'),
|
|
111
|
+
library: 'test-microservice',
|
|
112
|
+
publicPath: '/assets/',
|
|
113
|
+
fileName: 'application',
|
|
114
|
+
crossOriginLoading: 'anonymous',
|
|
115
|
+
hash: false,
|
|
116
|
+
//or
|
|
117
|
+
hash: {
|
|
118
|
+
js: true,
|
|
119
|
+
css: false
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
### preset
|
|
125
|
+
|
|
126
|
+
The preset property determines which preset to load into your webpack configuration.
|
|
127
|
+
|
|
128
|
+
```javascript
|
|
129
|
+
preset: "vue-typescript | typescript | javascript"
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
### bob
|
|
133
|
+
|
|
134
|
+
The bob object adds all necessary configuration to have your project generate a manifest file to be used by [Bob](https://github.com/studyportals/Bob).
|
|
135
|
+
|
|
136
|
+
- `name`**(required)**: The name of your microservice.
|
|
137
|
+
- `html`**(required)**: The HTML that needs to be output by your microservice. Can be a path to a document or a snippet.
|
|
138
|
+
- `baseURL`: The baseURL for your microservice assets.
|
|
139
|
+
- `async`: An array of JS filenames to be loaded async.
|
|
140
|
+
- `defer`: An array of CSS filenames to be lazy-loaded.
|
|
141
|
+
- `exclude`: An array of filenames (CSS and JS) that should be excluded from your manifest file.
|
|
142
|
+
- `dllPackages`: An array of objects that reference your Dll dependencies. They all require a name and a Dll manifest in the form of a json file.
|
|
143
|
+
|
|
144
|
+
```javascript
|
|
145
|
+
bob: {
|
|
146
|
+
name: 'MicroService',
|
|
147
|
+
html: '<div id=\"MicroServicePlaceholder\"></div>',
|
|
148
|
+
baseURL: '/dist',
|
|
149
|
+
defer: ['style'],
|
|
150
|
+
exclude: ['demo-assets'],
|
|
151
|
+
dllPackages: [
|
|
152
|
+
{
|
|
153
|
+
name: "package-dll",
|
|
154
|
+
manifest: require("@studyportals/package-dll/dist/manifest.json")
|
|
155
|
+
}
|
|
156
|
+
]
|
|
157
|
+
}
|
|
158
|
+
```
|
|
159
|
+
|
|
160
|
+
WebpackHelper uses [BobManifestGenerator](https://github.com/studyportals/BobManifestGenerator) to generate a manifest file.
|
|
161
|
+
|
|
162
|
+
### common
|
|
163
|
+
|
|
164
|
+
Extra Webpack configuration to be used for all environments can be passed in the `common` object. This configuration needs to adhere to Webpack's configuration interface and will be merged in with the other configuration through [webpack-merge](https://github.com/survivejs/webpack-merge).
|
|
165
|
+
|
|
166
|
+
### development
|
|
167
|
+
|
|
168
|
+
Extra Webpack configuration to be used for all development builds can be passed in the `development` object. This configuration needs to adhere to Webpack's configuration interface and will be merged in with the other configuration through [webpack-merge](https://github.com/survivejs/webpack-merge).
|
|
169
|
+
|
|
170
|
+
**NOTE**: Some default configuration for development builds will be added automatically. Details can be found [here](src/defaults/defaults.md).
|
|
171
|
+
|
|
172
|
+
### production
|
|
173
|
+
|
|
174
|
+
Extra Webpack configuration to be used for all production builds can be passed in the `production` object. This configuration needs to adhere to Webpack's configuration interface and will be merged in with the other configuration through [webpack-merge](https://github.com/survivejs/webpack-merge).
|
|
175
|
+
|
|
176
|
+
**NOTE**: Some default configuration for production builds will be added automatically. Details can be found [here](src/defaults/defaults.md).
|
|
177
|
+
|
|
178
|
+
## Presets
|
|
179
|
+
|
|
180
|
+
In order to make your life as easy as possible, Webpack Helper ships with a set of presets that will take care of putting some essential plugins and loaders in your configuration. The different presets are listed below.
|
|
181
|
+
|
|
182
|
+
More in depth information on what configuration these presets will add to your project can be found [here](src/presets/presets.md).
|
|
183
|
+
|
|
184
|
+
### javascript
|
|
185
|
+
|
|
186
|
+
The javascript preset will resolve all `.js` and `.json` files and transpiles them with Babel. If your project has styling, it will separate that out in a separate `.css` file.
|
|
187
|
+
|
|
188
|
+
### typescript
|
|
189
|
+
|
|
190
|
+
The typescript preset will resolve all `.ts`, `.tsx`, `.js` and `.json` files. It transpiles them using tsc and Babel. Be aware that you will need to include a `tsconfig.json` in your project for it to work properly. If your project has styling, it will separate that out in a separate `.css` file.
|
|
191
|
+
|
|
192
|
+
### vue-typescript
|
|
193
|
+
|
|
194
|
+
The vue-typescript preset will resolve all `.vue`, `.ts`, `.tsx`, `.js` and `.json` files. It transpiles them using vue-loader, tsc and Babel. Be aware that you will need to include a `tsconfig.json` in your project for it to work properly. If your project has styling, it will separate that out in a separate `.css` file.
|
|
195
|
+
|
|
196
|
+
## DoD compliance with Babel and Browserslist
|
|
197
|
+
|
|
198
|
+
In order to comply to [Studyportals' definition of done](https://knowledge-vault.studyportals.xyz/definitions-of-done/product/) we use `babel` to transpile our front-end code according to the browsers we need to support. To do this your project needs some configuration. When Webpack Helper is installed it will put standard configuration in the root of your project which consists of 2 files:
|
|
199
|
+
|
|
200
|
+
- `.babelrc`: A standard configuration for babel that loads the `babel-env` and `babel-typescripts` presets. You might need to add more plugins for your specific project.
|
|
201
|
+
- `.browserslistrc`: A configuration file for browserslist. This is used by `babel-env` to determine which browsers to transpile the code for. Within this file the configuration for student facing products will be loaded by default but other configurations can be easily loaded by uncommenting some lines.
|
package/package.json
CHANGED
|
@@ -1,58 +1,59 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@studyportals/webpack-helper",
|
|
3
|
-
"version": "2.5.
|
|
4
|
-
"description": "A collection of standard configurations and helpers for webpack.",
|
|
5
|
-
"main": "src/main.js",
|
|
6
|
-
"scripts": {
|
|
7
|
-
"test": "jest --coverage",
|
|
8
|
-
"build": "tsc
|
|
9
|
-
"prepublish": "npm run build",
|
|
10
|
-
"postinstall": "cp ./assets/.babelrc ./assets/.browserslistrc ../../../"
|
|
11
|
-
},
|
|
12
|
-
"files": [
|
|
13
|
-
"src/**/*.js",
|
|
14
|
-
"assets/*"
|
|
15
|
-
],
|
|
16
|
-
"author": {
|
|
17
|
-
"name": "Frank Kluijtmans",
|
|
18
|
-
"email": "frank@studyportals.com"
|
|
19
|
-
},
|
|
20
|
-
"license": "ISC",
|
|
21
|
-
"dependencies": {
|
|
22
|
-
"@babel/core": "^7.5.5",
|
|
23
|
-
"@babel/plugin-proposal-class-properties": "^7.13.0",
|
|
24
|
-
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
|
25
|
-
"@babel/plugin-transform-modules-commonjs": "^7.5.0",
|
|
26
|
-
"@babel/plugin-transform-runtime": "^7.5.5",
|
|
27
|
-
"@babel/plugin-transform-typescript": "^7.5.5",
|
|
28
|
-
"@babel/preset-env": "^7.5.5",
|
|
29
|
-
"@babel/preset-typescript": "^7.3.3",
|
|
30
|
-
"@babel/runtime": "^7.5.5",
|
|
31
|
-
"@studyportals/bob-manifest-generator": "^2.4.
|
|
32
|
-
"@studyportals/browserslist-config": "^1.2.0",
|
|
33
|
-
"@studyportals/dll-availability-tracker": "^1.0.2",
|
|
34
|
-
"@studyportals/vue-config": "^3.0.0",
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
"
|
|
38
|
-
"
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"vue-
|
|
48
|
-
"
|
|
49
|
-
"webpack
|
|
50
|
-
"webpack-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
"
|
|
55
|
-
"jest": "^25.1.0",
|
|
56
|
-
"
|
|
57
|
-
|
|
58
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@studyportals/webpack-helper",
|
|
3
|
+
"version": "2.5.1",
|
|
4
|
+
"description": "A collection of standard configurations and helpers for webpack.",
|
|
5
|
+
"main": "src/main.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"test": "jest --coverage",
|
|
8
|
+
"build": "tsc",
|
|
9
|
+
"prepublish": "npm run build",
|
|
10
|
+
"postinstall": "cp ./assets/.babelrc ./assets/.browserslistrc ../../../"
|
|
11
|
+
},
|
|
12
|
+
"files": [
|
|
13
|
+
"src/**/*.js",
|
|
14
|
+
"assets/*"
|
|
15
|
+
],
|
|
16
|
+
"author": {
|
|
17
|
+
"name": "Frank Kluijtmans",
|
|
18
|
+
"email": "frank@studyportals.com"
|
|
19
|
+
},
|
|
20
|
+
"license": "ISC",
|
|
21
|
+
"dependencies": {
|
|
22
|
+
"@babel/core": "^7.5.5",
|
|
23
|
+
"@babel/plugin-proposal-class-properties": "^7.13.0",
|
|
24
|
+
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
|
25
|
+
"@babel/plugin-transform-modules-commonjs": "^7.5.0",
|
|
26
|
+
"@babel/plugin-transform-runtime": "^7.5.5",
|
|
27
|
+
"@babel/plugin-transform-typescript": "^7.5.5",
|
|
28
|
+
"@babel/preset-env": "^7.5.5",
|
|
29
|
+
"@babel/preset-typescript": "^7.3.3",
|
|
30
|
+
"@babel/runtime": "^7.5.5",
|
|
31
|
+
"@studyportals/bob-manifest-generator": "^2.4.1",
|
|
32
|
+
"@studyportals/browserslist-config": "^1.2.0",
|
|
33
|
+
"@studyportals/dll-availability-tracker": "^1.0.2",
|
|
34
|
+
"@studyportals/vue-config": "^3.0.0",
|
|
35
|
+
"@types/mocha": "^9.1.0",
|
|
36
|
+
"babel-loader": "^8.0.6",
|
|
37
|
+
"css-loader": "^3.4.2",
|
|
38
|
+
"file-loader": "^6.0.0",
|
|
39
|
+
"mini-css-extract-plugin": "^0.9.0",
|
|
40
|
+
"node-sass": "^4.13.1",
|
|
41
|
+
"optimize-css-assets-webpack-plugin": "^5.0.3",
|
|
42
|
+
"path": "^0.12.7",
|
|
43
|
+
"sass-loader": "^8.0.2",
|
|
44
|
+
"terser-webpack-plugin": "^2.3.4",
|
|
45
|
+
"ts-loader": "^6.2.1",
|
|
46
|
+
"typescript": "^3.7.2",
|
|
47
|
+
"vue-loader": "^15.8.3",
|
|
48
|
+
"vue-template-compiler": "2.5.16",
|
|
49
|
+
"webpack": "^4.41.2",
|
|
50
|
+
"webpack-cli": "^3.3.10",
|
|
51
|
+
"webpack-merge": "^4.2.2"
|
|
52
|
+
},
|
|
53
|
+
"devDependencies": {
|
|
54
|
+
"@types/node": "^12.12.30",
|
|
55
|
+
"babel-jest": "^25.1.0",
|
|
56
|
+
"jest": "^25.1.0",
|
|
57
|
+
"ts-jest": "^25.2.1"
|
|
58
|
+
}
|
|
59
|
+
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
exports.ProductionConfig =
|
|
8
|
-
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const webpack = require('webpack');
|
|
4
|
+
const TerserPlugin = require('terser-webpack-plugin');
|
|
5
|
+
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
|
|
6
|
+
const DllAvailabilityTracker = require('@studyportals/dll-availability-tracker');
|
|
7
|
+
exports.ProductionConfig = (bobConfig) => {
|
|
8
|
+
let dllDependencies = ['library'];
|
|
9
9
|
if (bobConfig !== null && bobConfig.hasOwnProperty('dllPackages')) {
|
|
10
|
-
bobConfig.dllPackages.forEach(
|
|
10
|
+
bobConfig.dllPackages.forEach((dependency) => dllDependencies.push(dependency.manifest.name));
|
|
11
11
|
}
|
|
12
12
|
return {
|
|
13
13
|
plugins: [
|
|
@@ -29,7 +29,7 @@ exports.ProductionConfig = function (bobConfig) {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
]
|
|
32
|
-
}
|
|
32
|
+
},
|
|
33
33
|
}),
|
|
34
34
|
new DllAvailabilityTracker({
|
|
35
35
|
dependencies: dllDependencies || []
|
package/src/enums/mode.js
CHANGED
package/src/enums/preset.js
CHANGED
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
ConfigurationFactory.prototype.create = function (options) {
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const configuration_1 = require("../model/configuration");
|
|
4
|
+
class ConfigurationFactory {
|
|
5
|
+
create(options) {
|
|
8
6
|
return new configuration_1.Configuration(options);
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
}());
|
|
7
|
+
}
|
|
8
|
+
}
|
|
12
9
|
exports.ConfigurationFactory = ConfigurationFactory;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
package/src/main.js
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const configuration_factory_1 = require("./factories/configuration-factory");
|
|
4
|
+
const configurationFactory = new configuration_factory_1.ConfigurationFactory();
|
|
5
|
+
module.exports = configurationFactory;
|
|
@@ -1,22 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
var _a;
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const entry_1 = require("./entry");
|
|
4
|
+
const output_1 = require("./output");
|
|
5
|
+
const plugins_1 = require("./plugins");
|
|
6
|
+
const module_1 = require("./module");
|
|
7
|
+
const preset_1 = require("../enums/preset");
|
|
8
|
+
const vue_typescript_preset_1 = require("../presets/vue-typescript.preset");
|
|
9
|
+
const typescript_preset_1 = require("../presets/typescript.preset");
|
|
10
|
+
const javascript_preset_1 = require("../presets/javascript.preset");
|
|
11
|
+
const mode_1 = require("../enums/mode");
|
|
12
|
+
const production_config_1 = require("../defaults/production.config");
|
|
13
|
+
const development_config_1 = require("../defaults/development.config");
|
|
14
|
+
const ManifestGenerator = require("@studyportals/bob-manifest-generator").ManifestGenerator;
|
|
15
|
+
const DllReferencePlugin = require("@studyportals/bob-manifest-generator").DllReferencePlugin;
|
|
16
|
+
const merge = require("webpack-merge");
|
|
17
|
+
class Configuration {
|
|
18
|
+
constructor(options) {
|
|
20
19
|
this.bob = options.bob || null;
|
|
21
20
|
this.entry = new entry_1.Entry(options.entry);
|
|
22
21
|
this.output = new output_1.Output(options.output);
|
|
@@ -26,13 +25,13 @@ var Configuration = /** @class */ (function () {
|
|
|
26
25
|
this.plugins = new plugins_1.Plugins(options.plugins);
|
|
27
26
|
this.module = new module_1.Module(options.module);
|
|
28
27
|
this.commonConfig = options.common || {};
|
|
29
|
-
this.environmentSpecificConfig =
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
28
|
+
this.environmentSpecificConfig = {
|
|
29
|
+
[mode_1.Mode.DEVELOPMENT]: merge([options[mode_1.Mode.DEVELOPMENT], development_config_1.DevelopmentConfig]) || development_config_1.DevelopmentConfig,
|
|
30
|
+
[mode_1.Mode.PRODUCTION]: merge([options[mode_1.Mode.PRODUCTION], production_config_1.ProductionConfig(this.bob)]) || production_config_1.ProductionConfig(this.bob)
|
|
31
|
+
};
|
|
33
32
|
this.detectPresets();
|
|
34
33
|
}
|
|
35
|
-
|
|
34
|
+
get(mode) {
|
|
36
35
|
return merge({
|
|
37
36
|
entry: this.entry.getEntry(),
|
|
38
37
|
output: this.output.getOutput(),
|
|
@@ -48,9 +47,9 @@ var Configuration = /** @class */ (function () {
|
|
|
48
47
|
minimize: false
|
|
49
48
|
},
|
|
50
49
|
devtool: 'source-map'
|
|
51
|
-
}, this.getBobConfig(), this.commonConfig, this.getEnvironmentSpecificConfig(mode), { mode
|
|
52
|
-
}
|
|
53
|
-
|
|
50
|
+
}, this.getBobConfig(), this.commonConfig, this.getEnvironmentSpecificConfig(mode), { mode });
|
|
51
|
+
}
|
|
52
|
+
detectPresets() {
|
|
54
53
|
switch (this.preset) {
|
|
55
54
|
case preset_1.Preset.VUE_TYPESCRIPT:
|
|
56
55
|
this.injectPreset(new vue_typescript_preset_1.VueTypeScriptPreset());
|
|
@@ -64,25 +63,24 @@ var Configuration = /** @class */ (function () {
|
|
|
64
63
|
default:
|
|
65
64
|
break;
|
|
66
65
|
}
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
_this.plugins.addPlugin(plugin);
|
|
66
|
+
}
|
|
67
|
+
injectPreset(preset) {
|
|
68
|
+
const plugins = preset.getPlugins(this.getCSSFileName());
|
|
69
|
+
const module = preset.getModule();
|
|
70
|
+
plugins.forEach(plugin => {
|
|
71
|
+
this.plugins.addPlugin(plugin);
|
|
74
72
|
});
|
|
75
73
|
this.extensions = this.extensions.concat(preset.getExtensions());
|
|
76
74
|
this.module.setModule(module);
|
|
77
|
-
}
|
|
78
|
-
|
|
75
|
+
}
|
|
76
|
+
getEnvironmentSpecificConfig(mode) {
|
|
79
77
|
return this.environmentSpecificConfig[mode];
|
|
80
|
-
}
|
|
81
|
-
|
|
78
|
+
}
|
|
79
|
+
getBobConfig() {
|
|
82
80
|
if (this.bob === null) {
|
|
83
81
|
return {};
|
|
84
82
|
}
|
|
85
|
-
|
|
83
|
+
let dllPackages = [];
|
|
86
84
|
if (typeof this.bob.dllPackages !== 'undefined'
|
|
87
85
|
&& this.bob.dllPackages.length > 0) {
|
|
88
86
|
dllPackages = this.getBobDllDependencies();
|
|
@@ -93,27 +91,26 @@ var Configuration = /** @class */ (function () {
|
|
|
93
91
|
new ManifestGenerator(this.bob)
|
|
94
92
|
].concat(dllPackages)
|
|
95
93
|
};
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
|
|
94
|
+
}
|
|
95
|
+
getBobDllDependencies() {
|
|
96
|
+
let dependencies = [];
|
|
99
97
|
if (typeof this.bob.dllPackages === 'undefined')
|
|
100
98
|
return dependencies;
|
|
101
|
-
this.bob.dllPackages.forEach(
|
|
99
|
+
this.bob.dllPackages.forEach((dependency) => {
|
|
102
100
|
dependencies.push(new DllReferencePlugin({
|
|
103
101
|
name: dependency.name,
|
|
104
102
|
manifest: dependency.manifest
|
|
105
103
|
}));
|
|
106
104
|
});
|
|
107
105
|
return dependencies;
|
|
108
|
-
}
|
|
109
|
-
|
|
106
|
+
}
|
|
107
|
+
getCSSFileName() {
|
|
110
108
|
if (this.hash === false
|
|
111
109
|
|| typeof this.hash.css !== 'undefined'
|
|
112
110
|
&& this.hash.css === false) {
|
|
113
111
|
return 'style.css';
|
|
114
112
|
}
|
|
115
113
|
return 'style.[hash].css';
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
}());
|
|
114
|
+
}
|
|
115
|
+
}
|
|
119
116
|
exports.Configuration = Configuration;
|
package/src/model/entry.js
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
class Entry {
|
|
4
|
+
constructor(entry) {
|
|
5
5
|
this.entry = entry;
|
|
6
6
|
}
|
|
7
|
-
|
|
7
|
+
getEntry() {
|
|
8
8
|
return this.entry;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
}());
|
|
9
|
+
}
|
|
10
|
+
}
|
|
12
11
|
exports.Entry = Entry;
|
package/src/model/module.js
CHANGED
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
if (module === void 0) { module = {}; }
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const merge = require("webpack-merge");
|
|
4
|
+
class Module {
|
|
5
|
+
constructor(module = {}) {
|
|
7
6
|
this.module = {};
|
|
8
7
|
this.module = merge(this.module, module);
|
|
9
8
|
}
|
|
10
|
-
|
|
9
|
+
setModule(module) {
|
|
11
10
|
this.module = merge(this.module, module);
|
|
12
|
-
}
|
|
13
|
-
|
|
11
|
+
}
|
|
12
|
+
getModule() {
|
|
14
13
|
return this.module;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
}());
|
|
14
|
+
}
|
|
15
|
+
}
|
|
18
16
|
exports.Module = Module;
|
package/src/model/output.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
class Output {
|
|
4
|
+
constructor(outputConfig) {
|
|
5
5
|
this.path = outputConfig.path;
|
|
6
6
|
this.publicPath = outputConfig.publicPath || null;
|
|
7
7
|
this.library = outputConfig.library || null;
|
|
@@ -9,8 +9,8 @@ var Output = /** @class */ (function () {
|
|
|
9
9
|
this.fileName = outputConfig.fileName || "[name]";
|
|
10
10
|
this.crossOriginLoading = outputConfig.crossOriginLoading || null;
|
|
11
11
|
}
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
getOutput() {
|
|
13
|
+
let output = {
|
|
14
14
|
path: this.path,
|
|
15
15
|
filename: this.getFileName()
|
|
16
16
|
};
|
|
@@ -24,12 +24,12 @@ var Output = /** @class */ (function () {
|
|
|
24
24
|
output.crossOriginLoading = this.crossOriginLoading;
|
|
25
25
|
}
|
|
26
26
|
return output;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
|
|
27
|
+
}
|
|
28
|
+
getFileName() {
|
|
29
|
+
let fileName = this.addHash === true ? `${this.fileName}.[hash].js` : `${this.fileName}.js`;
|
|
30
30
|
return fileName;
|
|
31
|
-
}
|
|
32
|
-
|
|
31
|
+
}
|
|
32
|
+
shouldAddHash(hashConfig) {
|
|
33
33
|
if (typeof hashConfig === 'undefined') {
|
|
34
34
|
return true;
|
|
35
35
|
}
|
|
@@ -39,7 +39,6 @@ var Output = /** @class */ (function () {
|
|
|
39
39
|
return false;
|
|
40
40
|
}
|
|
41
41
|
return true;
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
}());
|
|
42
|
+
}
|
|
43
|
+
}
|
|
45
44
|
exports.Output = Output;
|
package/src/model/plugins.js
CHANGED
|
@@ -1,17 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
if (plugins === void 0) { plugins = []; }
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
class Plugins {
|
|
4
|
+
constructor(plugins = []) {
|
|
6
5
|
this.plugins = [];
|
|
7
6
|
this.plugins = this.plugins.concat(plugins);
|
|
8
7
|
}
|
|
9
|
-
|
|
8
|
+
addPlugin(plugin) {
|
|
10
9
|
this.plugins.push(plugin);
|
|
11
|
-
}
|
|
12
|
-
|
|
10
|
+
}
|
|
11
|
+
getPlugins() {
|
|
13
12
|
return this.plugins;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
}());
|
|
13
|
+
}
|
|
14
|
+
}
|
|
17
15
|
exports.Plugins = Plugins;
|
|
@@ -1,17 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
JavascriptPreset.prototype.getPlugins = function (filename) {
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
|
4
|
+
class JavascriptPreset {
|
|
5
|
+
getPlugins(filename) {
|
|
8
6
|
return [
|
|
9
7
|
new MiniCssExtractPlugin({
|
|
10
|
-
filename
|
|
8
|
+
filename
|
|
11
9
|
})
|
|
12
10
|
];
|
|
13
|
-
}
|
|
14
|
-
|
|
11
|
+
}
|
|
12
|
+
getModule() {
|
|
15
13
|
return {
|
|
16
14
|
rules: [
|
|
17
15
|
{
|
|
@@ -19,7 +17,7 @@ var JavascriptPreset = /** @class */ (function () {
|
|
|
19
17
|
use: [
|
|
20
18
|
MiniCssExtractPlugin.loader,
|
|
21
19
|
'css-loader'
|
|
22
|
-
]
|
|
20
|
+
],
|
|
23
21
|
},
|
|
24
22
|
{
|
|
25
23
|
test: /\.scss$/,
|
|
@@ -27,7 +25,7 @@ var JavascriptPreset = /** @class */ (function () {
|
|
|
27
25
|
MiniCssExtractPlugin.loader,
|
|
28
26
|
'css-loader',
|
|
29
27
|
'sass-loader'
|
|
30
|
-
]
|
|
28
|
+
],
|
|
31
29
|
},
|
|
32
30
|
{
|
|
33
31
|
test: /\.jsx?$/,
|
|
@@ -36,14 +34,13 @@ var JavascriptPreset = /** @class */ (function () {
|
|
|
36
34
|
}
|
|
37
35
|
]
|
|
38
36
|
};
|
|
39
|
-
}
|
|
40
|
-
|
|
37
|
+
}
|
|
38
|
+
getExtensions() {
|
|
41
39
|
return [
|
|
42
40
|
'*',
|
|
43
41
|
'.js',
|
|
44
42
|
'.json'
|
|
45
43
|
];
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
}());
|
|
44
|
+
}
|
|
45
|
+
}
|
|
49
46
|
exports.JavascriptPreset = JavascriptPreset;
|
|
@@ -1,17 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
}
|
|
7
|
-
TypeScriptPreset.prototype.getPlugins = function (filename) {
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
|
4
|
+
class TypeScriptPreset {
|
|
5
|
+
getPlugins(filename) {
|
|
8
6
|
return [
|
|
9
7
|
new MiniCssExtractPlugin({
|
|
10
|
-
filename
|
|
8
|
+
filename
|
|
11
9
|
})
|
|
12
10
|
];
|
|
13
|
-
}
|
|
14
|
-
|
|
11
|
+
}
|
|
12
|
+
getModule() {
|
|
15
13
|
return {
|
|
16
14
|
rules: [
|
|
17
15
|
{
|
|
@@ -19,7 +17,7 @@ var TypeScriptPreset = /** @class */ (function () {
|
|
|
19
17
|
use: [
|
|
20
18
|
MiniCssExtractPlugin.loader,
|
|
21
19
|
'css-loader'
|
|
22
|
-
]
|
|
20
|
+
],
|
|
23
21
|
},
|
|
24
22
|
{
|
|
25
23
|
test: /\.scss$/,
|
|
@@ -27,7 +25,7 @@ var TypeScriptPreset = /** @class */ (function () {
|
|
|
27
25
|
MiniCssExtractPlugin.loader,
|
|
28
26
|
'css-loader',
|
|
29
27
|
'sass-loader'
|
|
30
|
-
]
|
|
28
|
+
],
|
|
31
29
|
},
|
|
32
30
|
{
|
|
33
31
|
test: /\.tsx?$/,
|
|
@@ -48,15 +46,14 @@ var TypeScriptPreset = /** @class */ (function () {
|
|
|
48
46
|
}
|
|
49
47
|
]
|
|
50
48
|
};
|
|
51
|
-
}
|
|
52
|
-
|
|
49
|
+
}
|
|
50
|
+
getExtensions() {
|
|
53
51
|
return [
|
|
54
52
|
'*',
|
|
55
53
|
'.ts',
|
|
56
54
|
'.js',
|
|
57
55
|
'.json'
|
|
58
56
|
];
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
}());
|
|
57
|
+
}
|
|
58
|
+
}
|
|
62
59
|
exports.TypeScriptPreset = TypeScriptPreset;
|
|
@@ -1,23 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
}
|
|
9
|
-
VueTypeScriptPreset.prototype.getPlugins = function (filename) {
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const webpack = require("webpack");
|
|
4
|
+
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
|
5
|
+
const VueLoaderPlugin = require('vue-loader').VueLoaderPlugin;
|
|
6
|
+
class VueTypeScriptPreset {
|
|
7
|
+
getPlugins(filename) {
|
|
10
8
|
return [
|
|
11
9
|
new webpack.DllReferencePlugin({
|
|
12
10
|
manifest: require("@studyportals/vue-config/dist/library.json")
|
|
13
11
|
}),
|
|
14
12
|
new MiniCssExtractPlugin({
|
|
15
|
-
filename
|
|
13
|
+
filename
|
|
16
14
|
}),
|
|
17
15
|
new VueLoaderPlugin()
|
|
18
16
|
];
|
|
19
|
-
}
|
|
20
|
-
|
|
17
|
+
}
|
|
18
|
+
getModule() {
|
|
21
19
|
return {
|
|
22
20
|
rules: [
|
|
23
21
|
{
|
|
@@ -25,7 +23,7 @@ var VueTypeScriptPreset = /** @class */ (function () {
|
|
|
25
23
|
use: [
|
|
26
24
|
MiniCssExtractPlugin.loader,
|
|
27
25
|
'css-loader'
|
|
28
|
-
]
|
|
26
|
+
],
|
|
29
27
|
},
|
|
30
28
|
{
|
|
31
29
|
test: /\.scss$/,
|
|
@@ -33,7 +31,7 @@ var VueTypeScriptPreset = /** @class */ (function () {
|
|
|
33
31
|
MiniCssExtractPlugin.loader,
|
|
34
32
|
'css-loader',
|
|
35
33
|
'sass-loader'
|
|
36
|
-
]
|
|
34
|
+
],
|
|
37
35
|
},
|
|
38
36
|
{
|
|
39
37
|
test: /\.vue$/,
|
|
@@ -54,7 +52,7 @@ var VueTypeScriptPreset = /** @class */ (function () {
|
|
|
54
52
|
exclude: /node_modules\/(?!@studyportals\/).*/,
|
|
55
53
|
options: {
|
|
56
54
|
appendTsSuffixTo: [/\.vue$/]
|
|
57
|
-
}
|
|
55
|
+
},
|
|
58
56
|
},
|
|
59
57
|
{
|
|
60
58
|
test: /\.js$/,
|
|
@@ -70,8 +68,8 @@ var VueTypeScriptPreset = /** @class */ (function () {
|
|
|
70
68
|
},
|
|
71
69
|
]
|
|
72
70
|
};
|
|
73
|
-
}
|
|
74
|
-
|
|
71
|
+
}
|
|
72
|
+
getExtensions() {
|
|
75
73
|
return [
|
|
76
74
|
'*',
|
|
77
75
|
'.ts',
|
|
@@ -79,7 +77,6 @@ var VueTypeScriptPreset = /** @class */ (function () {
|
|
|
79
77
|
'.vue',
|
|
80
78
|
'.json'
|
|
81
79
|
];
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
}());
|
|
80
|
+
}
|
|
81
|
+
}
|
|
85
82
|
exports.VueTypeScriptPreset = VueTypeScriptPreset;
|