Update webpack config

This commit is contained in:
Chocobozzz 2017-09-06 21:48:15 +02:00
parent a8b5de6c67
commit 04de542abd
8 changed files with 89 additions and 98 deletions

View File

@ -1,4 +1,7 @@
module.exports = {
hmrModule: function (ngmodule) {
return ngmodule
},
NgProbeToken: {},
HmrState: function () {},
_createConditionalRootRenderer: function (rootRenderer, extraTokens, coreTokens) {

View File

@ -16,13 +16,14 @@ const ngcWebpack = require('ngc-webpack')
const WebpackNotifierPlugin = require('webpack-notifier')
/*
* Webpack Constants
*/
const HMR = helpers.hasProcessFlag('hot')
const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot')
const METADATA = {
title: 'PeerTube',
baseUrl: '/',
isDevServer: helpers.isWebpackDevServer()
isDevServer: helpers.isWebpackDevServer(),
HMR: HMR,
AOT: AOT
}
/*
@ -91,13 +92,6 @@ module.exports = function (options) {
{
test: /\.ts$/,
use: [
{
loader: '@angularclass/hmr-loader',
options: {
pretty: !isProd,
prod: isProd
}
},
{
loader: 'ng-router-loader',
options: {
@ -242,7 +236,7 @@ module.exports = function (options) {
/**
* The (\\|\/) piece accounts for path separators in *nix and Windows
*/
/angular(\\|\/)core(\\|\/)@angular/,
/(.+)?angular(\\|\/)core(.+)?/,
helpers.root('src'), // location of your src
{
/**
@ -276,7 +270,10 @@ module.exports = function (options) {
new HtmlWebpackPlugin({
template: 'src/index.html',
title: METADATA.title,
chunksSortMode: 'dependency',
chunksSortMode: function (a, b) {
const entryPoints = [ 'inline', 'polyfills', 'sw-register', 'styles', 'vendor', 'main' ]
return entryPoints.indexOf(a.names[0]) - entryPoints.indexOf(b.names[0])
},
metadata: METADATA,
inject: 'body'
}),

View File

@ -11,6 +11,7 @@ const AddAssetHtmlPlugin = require('add-asset-html-webpack-plugin')
const DefinePlugin = require('webpack/lib/DefinePlugin')
const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
const HotModuleReplacementPlugin = require('webpack/lib/HotModuleReplacementPlugin')
/**
* Webpack Constants
@ -18,14 +19,18 @@ const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
const ENV = process.env.ENV = process.env.NODE_ENV = 'development'
const HOST = process.env.HOST || 'localhost'
const PORT = process.env.PORT || 3000
const PUBLIC = process.env.PUBLIC_DEV || HOST + ':' + PORT
const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot')
const HMR = helpers.hasProcessFlag('hot')
const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
const METADATA = {
host: HOST,
port: PORT,
public: PUBLIC,
ENV: ENV,
HMR: HMR,
AOT: AOT,
API_URL: 'http://localhost:9000'
})
}
const DllBundlesPlugin = require('webpack-dll-bundles-plugin').DllBundlesPlugin
@ -125,11 +130,9 @@ module.exports = function (env) {
'HMR': METADATA.HMR,
'API_URL': JSON.stringify(METADATA.API_URL),
'process.version': JSON.stringify(process.version),
'process.env': {
'ENV': JSON.stringify(METADATA.ENV),
'NODE_ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR
}
'process.env.ENV': JSON.stringify(METADATA.ENV),
'process.env.NODE_ENV': JSON.stringify(METADATA.ENV),
'process.env.HMR': METADATA.HMR
}),
new DllBundlesPlugin({
@ -216,8 +219,9 @@ module.exports = function (env) {
}
}
})
}),
new HotModuleReplacementPlugin()
],
/**
@ -232,6 +236,7 @@ module.exports = function (env) {
port: METADATA.port,
host: METADATA.host,
historyApiFallback: true,
hot: METADATA.HMR,
watchOptions: {
ignored: /node_modules/
}

View File

@ -14,22 +14,24 @@ const DefinePlugin = require('webpack/lib/DefinePlugin')
const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin')
const OptimizeJsPlugin = require('optimize-js-plugin')
const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
const HashedModuleIdsPlugin = require('webpack/lib/HashedModuleIdsPlugin')
const ModuleConcatenationPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
/**
* Webpack Constants
*/
const ENV = process.env.NODE_ENV = process.env.ENV = 'production'
const HOST = process.env.HOST || 'localhost'
const PORT = process.env.PORT || 8080
const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot')
const METADATA = {
host: HOST,
port: PORT,
ENV: ENV,
HMR: false,
AOT: AOT,
API_URL: ''
})
}
module.exports = function (env) {
return [
@ -106,6 +108,7 @@ module.exports = function (env) {
* See: http://webpack.github.io/docs/configuration.html#plugins
*/
plugins: [
new ModuleConcatenationPlugin(),
/**
* Webpack plugin to optimize a JavaScript file for faster initial load
@ -142,12 +145,11 @@ module.exports = function (env) {
'ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR,
'API_URL': JSON.stringify(METADATA.API_URL),
'AOT': METADATA.AOT,
'process.version': JSON.stringify(process.version),
'process.env': {
'ENV': JSON.stringify(METADATA.ENV),
'NODE_ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR
}
'process.env.ENV': JSON.stringify(METADATA.ENV),
'process.env.NODE_ENV': JSON.stringify(METADATA.ENV),
'process.env.HMR': METADATA.HMR
}),
/**
@ -159,44 +161,28 @@ module.exports = function (env) {
*/
// NOTE: To debug prod builds uncomment //debug lines and comment //prod lines
new UglifyJsPlugin({
// beautify: true, //debug
// mangle: false, //debug
// dead_code: false, //debug
// unused: false, //debug
// deadCode: false, //debug
// compress: {
// screw_ie8: true,
// keep_fnames: true,
// drop_debugger: false,
// dead_code: false,
// unused: false
// }, // debug
// comments: true, //debug
beautify: false, // prod
output: {
comments: false
}, // prod
mangle: {
screw_ie8: true
}, // prod
compress: {
screw_ie8: true,
warnings: false,
conditionals: true,
unused: true,
comparisons: true,
sequences: true,
dead_code: true,
evaluate: true,
if_return: true,
join_vars: true,
negate_iife: false // we need this for lazy v8
}
parallel: true,
uglifyOptions: {
ie8: false,
ecma: 6,
warnings: true,
mangle: true,
output: {
comments: false,
beautify: false
}
},
warnings: true
}),
/**
* Plugin: NormalModuleReplacementPlugin
* Description: Replace resources that matches resourceRegExp with newResource
*
* See: http://webpack.github.io/docs/list-of-plugins.html#normalmodulereplacementplugin
*/
new NormalModuleReplacementPlugin(
/angular2-hmr/,
/(angular2|@angularclass)((\\|\/)|-)hmr/,
helpers.root('config/empty.js')
),
@ -208,26 +194,14 @@ module.exports = function (env) {
new HashedModuleIdsPlugin(),
/**
* Plugin: IgnorePlugin
* Description: Dont generate modules for requests matching the provided RegExp.
*
* See: http://webpack.github.io/docs/list-of-plugins.html#ignoreplugin
* AoT
*/
// new IgnorePlugin(/angular2-hmr/),
/**
* Plugin: CompressionPlugin
* Description: Prepares compressed versions of assets to serve
* them with Content-Encoding
*
* See: https://github.com/webpack/compression-webpack-plugin
*/
// install compression-webpack-plugin
// new CompressionPlugin({
// regExp: /\.css$|\.html$|\.js$|\.map$/,
// threshold: 2 * 1024
// })
(AOT ? (
new NormalModuleReplacementPlugin(
/@angular(\\|\/)compiler/,
helpers.root('config/empty.js')
)
) : (new LoaderOptionsPlugin({}))),
/**
* Plugin LoaderOptionsPlugin (experimental)

View File

@ -101,6 +101,7 @@
"purifycss-webpack": "^0.7.0",
"standard": "^10.0.0",
"tslint-config-standard": "^6.0.1",
"uglifyjs-webpack-plugin": "^0.4.6",
"webpack-bundle-analyzer": "^2.8.2",
"webpack-dev-server": "^2.4.5",
"webpack-dll-bundles-plugin": "^1.0.0-beta.5"

View File

@ -1,5 +1,5 @@
import { NgModule } from '@angular/core'
import { Routes, RouterModule } from '@angular/router'
import { Routes, RouterModule, PreloadAllModules } from '@angular/router'
const routes: Routes = [
{
@ -14,7 +14,12 @@ const routes: Routes = [
]
@NgModule({
imports: [ RouterModule.forRoot(routes) ],
imports: [
RouterModule.forRoot(routes, {
useHash: Boolean(history.pushState) === false,
preloadingStrategy: PreloadAllModules
})
],
exports: [ RouterModule ]
})
export class AppRoutingModule {}

View File

@ -1,22 +1,28 @@
/* tslint: disable */
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { decorateModuleRef } from './app/environment';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'
import { decorateModuleRef } from './app/environment'
import { hmrModule } from '@angularclass/hmr'
/**
* App Module
* our top level module that holds all of our components
*/
import { AppModule } from './app';
import { AppModule } from './app'
/**
* Bootstrap our Angular app with a top level NgModule
*/
export function main(): Promise<any> {
export function main (): Promise<any> {
return platformBrowserDynamic()
.bootstrapModule(AppModule)
.then(decorateModuleRef)
.catch((err) => console.error(err));
.then((ngModuleRef: any) => {
// `module` global ref for webpackhmr
// Don't run this in Prod
return hmrModule(ngModuleRef, module)
})
.catch((err) => console.error(err))
}
/**
@ -25,15 +31,15 @@ export function main(): Promise<any> {
*/
switch (document.readyState) {
case 'loading':
document.addEventListener('DOMContentLoaded', _domReadyHandler, false);
break;
document.addEventListener('DOMContentLoaded', _domReadyHandler, false)
break
case 'interactive':
case 'complete':
default:
main();
main()
}
function _domReadyHandler() {
document.removeEventListener('DOMContentLoaded', _domReadyHandler, false);
main();
function _domReadyHandler () {
document.removeEventListener('DOMContentLoaded', _domReadyHandler, false)
main()
}

View File

@ -2,4 +2,4 @@
cd client || exit -1
npm run webpack-dev-server -- --config config/webpack.dev.js --progress --profile --colors --watch --content-base src/ --inline --hot --open
npm run webpack-dev-server -- --config config/webpack.dev.js --progress --profile --colors --watch --content-base src/ --hotOnly --open