Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Step 1.4: Add Ionic's base webpack file to the project
- Loading branch information
1 parent
a70f9a9
commit 01e1551
Showing
1 changed file
with
147 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,147 @@ | ||
/* | ||
* The webpack config exports an object that has a valid webpack configuration | ||
* For each environment name. By default, there are two Ionic environments: | ||
* "dev" and "prod". As such, the webpack.config.js exports a dictionary object | ||
* with "keys" for "dev" and "prod", where the value is a valid webpack configuration | ||
* For details on configuring webpack, see their documentation here | ||
* https://webpack.js.org/configuration/ | ||
*/ | ||
|
||
var path = require('path'); | ||
var webpack = require('webpack'); | ||
var ionicWebpackFactory = require(process.env.IONIC_WEBPACK_FACTORY); | ||
|
||
var ModuleConcatPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin'); | ||
var PurifyPlugin = require('@angular-devkit/build-optimizer').PurifyPlugin; | ||
|
||
var optimizedProdLoaders = [ | ||
{ | ||
test: /\.json$/, | ||
loader: 'json-loader' | ||
}, | ||
{ | ||
test: /\.js$/, | ||
loader: [ | ||
{ | ||
loader: process.env.IONIC_CACHE_LOADER | ||
}, | ||
|
||
{ | ||
loader: '@angular-devkit/build-optimizer/webpack-loader', | ||
options: { | ||
sourceMap: true | ||
} | ||
}, | ||
] | ||
}, | ||
{ | ||
test: /\.ts$/, | ||
loader: [ | ||
{ | ||
loader: process.env.IONIC_CACHE_LOADER | ||
}, | ||
|
||
{ | ||
loader: '@angular-devkit/build-optimizer/webpack-loader', | ||
options: { | ||
sourceMap: true | ||
} | ||
}, | ||
|
||
{ | ||
loader: process.env.IONIC_WEBPACK_LOADER | ||
} | ||
] | ||
} | ||
]; | ||
|
||
function getProdLoaders() { | ||
if (process.env.IONIC_OPTIMIZE_JS === 'true') { | ||
return optimizedProdLoaders; | ||
} | ||
return devConfig.module.loaders; | ||
} | ||
|
||
var devConfig = { | ||
entry: process.env.IONIC_APP_ENTRY_POINT, | ||
output: { | ||
path: '{{BUILD}}', | ||
publicPath: 'build/', | ||
filename: '[name].js', | ||
devtoolModuleFilenameTemplate: ionicWebpackFactory.getSourceMapperFunction(), | ||
}, | ||
devtool: process.env.IONIC_SOURCE_MAP_TYPE, | ||
|
||
resolve: { | ||
extensions: ['.ts', '.js', '.json'], | ||
modules: [path.resolve('node_modules')] | ||
}, | ||
|
||
module: { | ||
loaders: [ | ||
{ | ||
test: /\.json$/, | ||
loader: 'json-loader' | ||
}, | ||
{ | ||
test: /\.ts$/, | ||
loader: process.env.IONIC_WEBPACK_LOADER | ||
} | ||
] | ||
}, | ||
|
||
plugins: [ | ||
ionicWebpackFactory.getIonicEnvironmentPlugin(), | ||
ionicWebpackFactory.getCommonChunksPlugin() | ||
], | ||
|
||
// Some libraries import Node modules but don't use them in the browser. | ||
// Tell Webpack to provide empty mocks for them so importing them works. | ||
node: { | ||
fs: 'empty', | ||
net: 'empty', | ||
tls: 'empty' | ||
} | ||
}; | ||
|
||
var prodConfig = { | ||
entry: process.env.IONIC_APP_ENTRY_POINT, | ||
output: { | ||
path: '{{BUILD}}', | ||
publicPath: 'build/', | ||
filename: '[name].js', | ||
devtoolModuleFilenameTemplate: ionicWebpackFactory.getSourceMapperFunction(), | ||
}, | ||
devtool: process.env.IONIC_SOURCE_MAP_TYPE, | ||
|
||
resolve: { | ||
extensions: ['.ts', '.js', '.json'], | ||
modules: [path.resolve('node_modules')] | ||
}, | ||
|
||
module: { | ||
loaders: getProdLoaders() | ||
}, | ||
|
||
plugins: [ | ||
ionicWebpackFactory.getIonicEnvironmentPlugin(), | ||
ionicWebpackFactory.getCommonChunksPlugin(), | ||
new ModuleConcatPlugin(), | ||
new PurifyPlugin() | ||
], | ||
|
||
// Some libraries import Node modules but don't use them in the browser. | ||
// Tell Webpack to provide empty mocks for them so importing them works. | ||
node: { | ||
fs: 'empty', | ||
net: 'empty', | ||
tls: 'empty' | ||
} | ||
}; | ||
|
||
|
||
module.exports = { | ||
dev: devConfig, | ||
prod: prodConfig | ||
} | ||
|