I'm using this angular 4 seed app: https://github.com/2sic/app-tutorial-angular4-hello-dnn
It uses webpack and works fine.
It only seems to serve the dev files and not the dist/ folder.
I want to ng serve the dist folder.
Not sure the command to do this or if I need to install a lite server or something.
I run this command to create the dist folder (which works fine):
g build --prod --aot --output-hashing=none
Now I want to run this build in the browser.
First of all generate a build using the command ng build --prod --aot --output-hashing=none . This will create a dist folder in your directory structure. After this, run http-server ./dist , which will start serving your project from dist folder.
The dist folder is the build folder which contains all the files and folders which can be hosted in the server. The dist folder contains the compiled code of your angular application in the format of JavaScript and also the required HTML and CSS files.
The problem here is that ng serve doesn't produce dist directory that wordpress requires. To sum up, the theme environment requires two things: live reload. dist folder.
You can use http-server for doing so. First of all generate a build using the command ng build --prod --aot --output-hashing=none
. This will create a dist folder in your directory structure.
After this, run http-server ./dist
, which will start serving your project from dist folder.
Make sure you have installed http-server globally using
npm install http-server -g
For reference, see https://www.npmjs.com/package/http-server
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With