Angular 2 Cli Issue while ng build --prod but if I use ng build only then it work's fine but size of app is too large - angular2-cli

I am having this issue while ng build --prod. it works fine ng build but give issue in ng build --prod
ERROR in Expected 'styles' to be an array of strings.
ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in 'D:\Projects\simplifyng2\src'
# ./src/main.ts 5:0-74
# multi ./src/main.ts

Based on the error message, I can assume that you forgot to use square brackets in the styles property either in .angular-cli.json or in one of your components.
When you run ng build --prod, it performs AOT by default. As per my experience, AOT compiler catches more errors than JiT. Try this experiment - turn off the AoT during the prod build:
ng build -prod -aot=false
Most likely you won't see any errors.

Related

Error "URL parsing failed" in Nuxt.js2 when using the command "npm run build"

I am using Nuxt 2 when I use npm run dev, there are no errors or problems
but when I use npm run build, the following error occurs:
I deleted some packages, removed individual pages and components, and rebuilt google search but it had no effect.
you need to downgrade node.js to version 12

parcel build static/index.html × Build failed. Error: No transformers found for index.x-handlebars-template

I am trying to build an application with handlebars templating and express server. index.html file has all the handlebar templating within script tags with mentioned type="text/x-handlebars-template"
When I run "parcel build static/index.html", build is failing with following error message.
"Build failed. Error: No transformers found for index.x-handlebars-template."

Nuxt: Command 'nuxt' not found - Output directory `dist/` does not exists

I have successfully created a Nuxt.js project with this configuration using the CLI:
Project name: test
Programming language: JavaScript
Package manager: Npm
UI framework: None
Nuxt.js modules: None
Linting tools: None
Testing framework: None
Rendering mode: Single Page App
Deployment target: Static (Static/JAMStack hosting)
Development tools: jsconfig.json
Version control system: Git
The developement server runs properly with npm run dev.
npm run build also runs without errors and tells me that:
Ready to run nuxt generate
But the execution of nuxt generate leads to the error Command 'nuxt' not found. This is strange because nuxt seems to be installed when I execute npm nuxt list.
I first reinstalled just nuxt and then all dependencies after deleting the node_modules/ folder, but the error remains the same. If I just run npm run start it tells me
Nuxt Fatal Error
Error: Output directory `dist/` does not exists, please use
`nuxt generate` before `nuxt start` for static target.
This is strange again because the .nuxt/dist/ folder exists.
Does anyone have an idea what is going wrong?
I have solved the problem. For me it works if I run npm run generate instead of nuxt generate.

vue-cli-service build fails with 0 errors

Is there a way to track down this kind of build problem? I.e. a flag that would show more detailed error information? My project is very much like the default vue cli project. It has been working fine for months until this morning.
$ vue-cli-service build --mode dev
⠏ Building for dev...
ERROR Failed to compile with 0 errors 12:06:07 PM
ERROR Build failed with errors.
error Command failed with exit code 1.
In this case, I had a file called worker.js which is a web worker being loaded by worker-loader. In worker.js I import a second .js file which imports a missing .js file (due to my error). For whatever reason, this error doesn't make it to the surface of vue-cli-service build.

Failed to Compile After Installing Vuetify with Vue CLI 3

I tried to create a new Vue app with Vuetify by using the command from Vuetify homepage.
Following is the command I used:
npm install #vue/cli -g
vue create my-app // all options are default settings when creating
cd my-app
vue add vuetify // all options are default settings when running
All commands above mentioned completed perfectly. However, after I launch the hot-reload developing environment by the following command.
npm run serve
An error would occur as the following standard output.
> my-app#0.1.0 serve /home/seanwu/my-app
> vue-cli-service serve
INFO Starting development server...
94% after seal
ERROR Failed to compile with 1 errors 3:05:24 PM
error in ./src/main.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
BrowserslistError: [BABEL] /home/seanwu/my-app/src/main.js: /home/seanwu/my-app contains both .browserslistrc and package.json with browsers (While processing: "/home/seanwu/my-app/node_modules/#vue/babel-preset-app/index.js$0")
at /home/seanwu/my-app/node_modules/browserslist/node.js:239:15
at eachParent (/home/seanwu/my-app/node_modules/browserslist/node.js:46:18)
at Object.findConfig (/home/seanwu/my-app/node_modules/browserslist/node.js:219:20)
at Function.loadConfig (/home/seanwu/my-app/node_modules/browserslist/node.js:150:37)
at browserslist (/home/seanwu/my-app/node_modules/browserslist/index.js:187:31)
at getTargets (/home/seanwu/my-app/node_modules/#babel/preset-env/lib/targets-parser.js:133:50)
at _default (/home/seanwu/my-app/node_modules/#babel/preset-env/lib/index.js:184:46)
at /home/seanwu/my-app/node_modules/#babel/helper-plugin-utils/lib/index.js:19:12
at loadDescriptor (/home/seanwu/my-app/node_modules/#babel/core/lib/config/full.js:163:14)
at cachedFunction (/home/seanwu/my-app/node_modules/#babel/core/lib/config/caching.js:42:19)
at loadPresetDescriptor (/home/seanwu/my-app/node_modules/#babel/core/lib/config/full.js:233:63)
at config.presets.map.descriptor (/home/seanwu/my-app/node_modules/#babel/core/lib/config/full.js:68:19)
at Array.map (<anonymous>)
at recurseDescriptors (/home/seanwu/my-app/node_modules/#babel/core/lib/config/full.js:66:38)
at recurseDescriptors (/home/seanwu/my-app/node_modules/#babel/core/lib/config/full.js:92:27)
at loadFullConfig (/home/seanwu/my-app/node_modules/#babel/core/lib/config/full.js:106:6)
# multi (webpack)-dev-server/client?http://192.168.1.76:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
I have no idea why this would happen as being new to front-end development and following every instruction from the Quick Start web page. Maybe there are some stupid mistakes I made to cause this error.
What Node/npm version are you using? I'd assume the official tutorial works/worked at some point. I'd use nvm to install different Node.js versions. That also changes the npm version. Then try npm install and npm start again.
Or you could delete .browserslistrc in /home/seanwu/my-app, so you don't have two conflicting files.