Comments (32)
That bit is the next one I'm working on, to be able to bundle stuff.
from angular-cli.
Currently ng build --prod still generates source maps
How can I build without suorce maps?
Thanks
from angular-cli.
Still missing:
- add a CNAME?
- enableProdMode()
- inlining HTML and CSS resources
- bundling
- taking lazy routes into account
- only use service worker in prod builds #230
from angular-cli.
You are talking about adding a CNAME
file, which implies that Github Pages is a "first citizen". If you directly support gh-pages, than you also want to copy dist/index.html
to dist/404.html
. This will enable browser-reloads together with the PathLocationStrategy
.
from angular-cli.
No, i don't say it fails, i say it's not 'production'. Production build should contain .min lib files, no ts or sourcemaps and etc
from angular-cli.
@neilhem is there an option to skip sourcemaps generation when building using ng build -prod
?
from angular-cli.
hello @filipesilva do we have an approximate timeline for this? I have a project that I will need to deploy to production soon, is there anything you recommend we should use until this is completed?
from angular-cli.
@mashhoodr you can already do production builds, the thing that is missing is more than 2 environments.
from angular-cli.
I think this issue is obsolete by now. All of the features mentioned so far have been addressed, with the possible exception of having service workers in all prod builds. That warrants discussion though so probably should be another issue.
from angular-cli.
Hey @Misiu, I'm using ng build --prod --aot --no-sourcemap --no-vendor-chunk
for my production build.
Still, I get too many files that I believe are unnecessary (but maybe they're not). Would be nice to have all the production deployment options such as: How to deploy gzipped version, how to deploy not gzipped version, with sourcemaps, without sourcemaps...
This are all the files I get when I execute that command. Would appreciate a way to tidy up the production build, maybe include folders to separate files, such as 'js' & 'css'. I also would like to know if I can upload to my cloudfront the .gz without uploading the .js
my angular-cli.json
{
"project": {
"version": "1.0.0-beta.22-1",
"name": "webapp-21b"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"download",
".well-known",
"robots.txt",
"sitemap.xml"
],
"index": "index.html",
"main": "main.ts",
"test": "test.ts",
"tsconfig": "tsconfig.json",
"prefix": "app",
"mobile": false,
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.css",
"./css/main.scss",
"./css/buttons.scss",
"./css/forms.scss",
"./css/navbar.scss",
"./css/nouislider.scss",
"./css/mixins.scss",
"./css/spinner.scss",
"./css/utils.scss",
"./css/vars.scss"
],
"scripts": [
"./assets/js/noUiSlider.9.0.0/nouislider.min.js",
"./assets/js/wNumb.js"
],
"environments": {
"source": "environments/environment.ts",
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"addons": [
],
"packages": [
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"prefixInterfaces": false,
"inline": {
"style": false,
"template": false
},
"spec": {
"class": false,
"component": true,
"directive": true,
"module": false,
"pipe": true,
"service": true
}
}
}
from angular-cli.
Are you getting a specific error? I was able to run this it generates to dist/
Make sure you've got node > 4.1.0.
from angular-cli.
Prod builds (or any custom environment builds) are currently not supported. It's one of the many things that need to happen in order to make this project production ready.
from angular-cli.
Looks like the /dist directory contains the exact copy of src directory including typescript files. I think the typescript files are not required in /dist. The /dist/vendor directory is clean, which has only the javascript files.
from angular-cli.
In order to do the production build we can take the current build and:
- remove livereload references in the
index.html
- stop copying the
ts
files - stop copying the
tsconfig.json
file - add a CNAME?
- enableProdMode()
- assure that pre-compiled style (LESS/SASS) files are not copied to the dist directory (tks @Brocco )
What else?
from angular-cli.
Assure that pre-compiled style (LESS/SASS) files are not copied to the dist directory
from angular-cli.
Config files perhaps, with API addresses and 3rd party services tokens.
from angular-cli.
I think this list looks good @cironunes. Will we also be minifying/mangling?
Really, this production flow is the only thing missing for me to start using this hard right now.
from angular-cli.
Picked this as the official production build issue to follow.
from angular-cli.
As discussed offline, Filipe will take over for the next few steps, since you don't have as much time :) Good work Ciro!
Added 2 points to your todo list above.
from angular-cli.
So we are bundling now? That would be the best news I've heard all week.
from angular-cli.
I'd love to continue working on that, but I just don't have the time at the moment :(
I'm glad that Filipe is taking care of it. 😄
from angular-cli.
@cironunes I added another item to the list:
- only use service worker in prod builds #230
from angular-cli.
I know still WIP here, but am I missing a flag for using the production vendor libs or is it just unfinished? I can only get angular2.dev.js
for instance. That ~1 second bootstrapping time is maddening. Cheers!
from angular-cli.
Is there any way to add a custom environment by creating a file named for instance config/environment.stage.ts and then execute ng build --environment=stage ? It looks like it's defaulting to dev now.
from angular-cli.
@cdarken no, it is not currently possible to have more environments other than dev and prod. It's one of my next action items though.
I should mention though (since I haven't yet updated the readme), all builds using -prod
use bundling and tree shaking at the moment.
from angular-cli.
Thanks, I will wait patiently then.
from angular-cli.
What about Service Workers?
Also images are minifyed and filerevved? (for permanent caching)
Thanks guys!!!
from angular-cli.
Currently service workers are only enabled for mobile projects, but we're looking at having them in all prod builds.
Images are not processed at the moment either.
from angular-cli.
can anyone tell plz how to run angular cli production mode forever. i want to deploy production build on live server. But i am not getting it.
from angular-cli.
Run ng build -prod
from angular-cli.
Can anybody explain,
how to run forever with angular-cli?
What changes i need to do in my files?
Thanks :)
from angular-cli.
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.
from angular-cli.
Related Issues (20)
- [browser-esbuild] live-reload=false workflow is less convenient now
- Excessive modulepreload Links in Angular 18.0.0-next.4 Affecting Performance Metrics HOT 5
- Bug: esbuild builder 3rd party libs built not properly with browserify paths HOT 1
- Only reload on ng serve when change in code happen HOT 3
- Ability to generate hash on every build without changing file HOT 1
- sourcemap isn't working HOT 2
- support npm version 1- HOT 1
- CSS background-image: url() not working for relative paths in Angular library project HOT 1
- [reopen] [proposal] auto polyfilling support via @babel/preset-env HOT 1
- Newly added assets are not served by the development server HOT 1
- host property of the compoments not providing typings intellisense and also class applied to it not getting processed by tailwindcss HOT 1
- Script tags are not added to the child pages when build SSR project HOT 1
- IWAs (Isolated Web Apps) integration proposal
- Styles optimization option - "removeSpecialComments" is not working HOT 5
- Failed to read Git tree: fatal: not a git repository (or any of the parent directories): .git HOT 9
- Server Actions HOT 1
- ng commands hangs on node version v20.12.2 HOT 8
- importmap with ssr HOT 1
- Vite dev server with npm workspaces not reloading on project reference update HOT 1
- angular report server dependencies as not esm HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from angular-cli.