I have an angular project with manual setup (no angular-cli) and configured the build to generate multiple html files using HTML Webpack Plugin. Now, I am planning to move to angular-cli and wondering how can i generate multiple html files along with index.html?
how to generate multiple html files with angular-cli builds?
4.2k Views Asked by Praveen Gajjala At
2
There are 2 best solutions below
0
mirik
On
You can use custom-webpack with plugins:
- angular.json
"options": {
"customWebpackConfig": {
"path": "./custom-webpack.config.js"
}
}
- custom-webpack.config.js
import HtmlWebpackPlugin from 'html-webpack-plugin';
export default env => {
...
return {
...
"plugins": [
new HtmlWebpackPlugin({
template: 'index.html',
minify: true
})
]
}
}
Related Questions in ANGULAR
- Is it possible to use ES5 JavaScript with Angular 2 instead of TypeScript?
- Module '"angular2/angular2"' has no exported member 'For'
- import syntax in typescript creating another js file in visual studio
- Separate ts file for imports
- How to use an AngularJS 2 component multiple times in the same page?
- injectables not working in angular 2.0 latest build 26
- Does angular2 bootstrap have a way to dynamically target elements like it does in angular 1.x
- Import {} from location is not found in VS Code using TypeScript and Angular 2
- Angular 2/Typescript: require not found
- ng-switch in Angular2
- Angular 2 import issue: "Zone already exported on window the object!"
- How to make FileReader work with Angular2?
- Writing the most basic Unit test in Angular 2?
- Angular2: Creating child components programmatically
- AngularJS - TypeError: Cannot read property 'canonicalUrl' of undefined
Related Questions in WEBPACK
- RequireJS shim config in webpack
- Webpack Uglify plugin returns "Killed" on Ubuntu
- Log to node console or debug during webpack build
- Gulp with WebPack. Which should be building my coffee/jade etc.?
- Webpack: silence output
- Webpack: Must i specify the domain in publicPath for url() directive to work in CSS?
- webpack-dev-server & jsxhint: const '$__0' has already been declared
- Use Webpack to split out a module so that it can be loaded in a WebWorker
- oclazyLoad with webpack to support lazy loading for Angularjs is not working on minification
- How to make webpack to produce only one file and include all chunks?
- Reduce transpiled code helpers with babel and webpack
- webpack sass compliation stuck, however same works with similar other file also same problamatic sass file works with gulp-sass module
- Webpack html-loader returns full module definition
- Webpack: Create a bundle with each file in directory
- Include paths for imports in babel using webpack
Related Questions in ANGULAR-CLI
- Running a single test file
- Errro running ng serve - module has no exported member
- 404 error when try to access a direct url in different modules with angular-cli server
- Cloning a repo based on Angular CLI
- External JavaScript library in angular-cli project throws error that $root.document is undefined
- Angular cli for existing github project
- [email protected] (2016-12-15) NOT on npm
- Cannot GET with Angular 2 CLI build
- Handle url redirects in angular-cli application deployed to github pages
- Error using jsonwebtoken with angular-cli application
- Specify order of Styles in angular-cli.json
- Angular, Bootstrap 4, angular-cli - where to place dependent scss and import it?
- Module not found: Error: Can't resolve
- Ag-grid and Angular2 using angular-cli
- Angular 2 CLI so much time compiling
Related Questions in HTML-WEBPACK-PLUGIN
- Webpack dev server and css modules
- Webpack - html-webpack-plugin - one filename - multi inject
- How html bundling work with $.component.html files into angular 2 huge application?
- how to generate multiple html files with angular-cli builds?
- How to use chunksSortMode in HtmlWebpackPlugin / webpack 2
- HTML Webpack Plugin will not compile as Thymeleaf variables are undefined
- Img src not updated with publicPath using HtmlWebpackPlugin templateContent
- How build index.html with ./ instead of / bundle src in html-webpack-plugin
- html-webpack-plugin child compilation syntax error
- error: cannot find module html-webpack-plugin
- Using Webpack HtmlWebpackPlugin
- Html-webpack-plugin template file body being ignored
- HtmlWebpackPlugin order of included bundle files
- Webpack-Hot-Middleware not working with HtmlWebpackPlugin
- webpack HtmlWebpackPlugin is not a constructor?
Trending Questions
- UIImageView Frame Doesn't Reflect Constraints
- Is it possible to use adb commands to click on a view by finding its ID?
- How to create a new web character symbol recognizable by html/javascript?
- Why isn't my CSS3 animation smooth in Google Chrome (but very smooth on other browsers)?
- Heap Gives Page Fault
- Connect ffmpeg to Visual Studio 2008
- Both Object- and ValueAnimator jumps when Duration is set above API LvL 24
- How to avoid default initialization of objects in std::vector?
- second argument of the command line arguments in a format other than char** argv or char* argv[]
- How to improve efficiency of algorithm which generates next lexicographic permutation?
- Navigating to the another actvity app getting crash in android
- How to read the particular message format in android and store in sqlite database?
- Resetting inventory status after order is cancelled
- Efficiently compute powers of X in SSE/AVX
- Insert into an external database using ajax and php : POST 500 (Internal Server Error)
Popular Questions
- How do I undo the most recent local commits in Git?
- How can I remove a specific item from an array in JavaScript?
- How do I delete a Git branch locally and remotely?
- Find all files containing a specific text (string) on Linux?
- How do I revert a Git repository to a previous commit?
- How do I create an HTML button that acts like a link?
- How do I check out a remote Git branch?
- How do I force "git pull" to overwrite local files?
- How do I list all files of a directory?
- How to check whether a string contains a substring in JavaScript?
- How do I redirect to another webpage?
- How can I iterate over rows in a Pandas DataFrame?
- How do I convert a String to an int in Java?
- Does Python have a string 'contains' substring method?
- How do I check if a string contains a specific word?
I do not quite understand the purpose of you having multiple html files.
You might need to check this angular cli issue: Support for multiple html pages. But in case if you want to setup
angular clito be able produce multiple apps, then check this issues:However you can always customize the default
angular cliwebpack configanyway you want by using eject feature. Check this issue on that matter.