Topic: Error configuring Universal Angular
Hector Alejandro Rodriguez asked 6 years ago
Start your code here Project 'project-name' could not be found in workspace. Error: Project 'project-name' could not be found in workspace. at Workspace.getProject (C:UserscriacaoDocumentsprojecturocentrolognode_modules@angularclinode_modules@angular-devkitcoresrcworkspaceworkspace.js:83:19) at Architect.getBuilderConfiguration (C:UserscriacaoDocumentsprojecturocentrolognode_modules@angularclinode_modules@angular-devkitarchitectsrcarchitect.js:96:41) at MergeMapSubscriber._loadWorkspaceAndArchitect.pipe.operators_1.concatMap [as project] (C:UserscriacaoDocumentsprojecturocentrolognode_modules@angularclimodelsarchitect-command.js:64:55) at MergeMapSubscriber._tryNext (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternaloperatorsmergeMap.js:122:27) at MergeMapSubscriber._next (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternaloperatorsmergeMap.js:112:18) at MergeMapSubscriber.Subscriber.next (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternalSubscriber.js:103:18) at TapSubscriber._next (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternaloperatorstap.js:109:26) at TapSubscriber.Subscriber.next (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternalSubscriber.js:103:18) at MergeMapSubscriber.notifyNext (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternaloperatorsmergeMap.js:141:26) at InnerSubscriber._next (C:UserscriacaoDocumentsprojecturocentrolognode_modulesrxjsinternalInnerSubscriber.js:30:21)
Arkadiusz Idzikowski staff answered 6 years ago
Hector Alejandro Rodriguez answered 6 years ago
Hello, here I leave my server.ts, webpack.server.config.js, package.json and angular.json, I would appreciate a lot of your help. Thank you
./server.ts
import 'zone.js/dist/zone-node'; import 'reflect-metadata'; import { renderModuleFactory } from '@angular/platform-server'; import { enableProdMode } from '@angular/core'; import * as express from 'express'; import { join } from 'path'; import { readFileSync } from 'fs'; const domino = require('domino'); const fs = require('fs'); const path = require('path'); // Faster server renders w/ Prod mode (dev mode never needed) enableProdMode(); // Express server const app = express(); const PORT = process.env.PORT || 4201; const DIST_FOLDER = join(process.cwd(), 'dist/browser'); // Our index.html we'll use as our template const template = readFileSync(join(DIST_FOLDER, 'index.html')).toString(); const win = domino.createWindow(template); global['window'] = win; global['Node'] = win.Node; global['navigator'] = win.navigator; global['Event'] = win.Event; global['Event']['prototype'] = win.Event.prototype; global['document'] = win.document; // * NOTE :: leave this as require() since this file is built Dynamically from webpack const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main'); const { provideModuleMap } = require('@nguniversal/module-map-ngfactory-loader'); app.engine('html', (_, options, callback) => { renderModuleFactory(AppServerModuleNgFactory, { // Our index.html document: template, url: options.req.url, // DI so that we can get lazy-loading to work differently (since we need it to just instantly render it) extraProviders: [ provideModuleMap(LAZY_MODULE_MAP) ] }).then(html => { callback(null, html); }); }); app.set('view engine', 'html'); app.set('views', DIST_FOLDER); // Server static files from dist folder app.get('*.*', express.static(DIST_FOLDER)); // All regular routes use the Universal engine app.get('*', (req, res) => { res.render('index', { req }); }); // Start up the Node server app.listen(PORT, () => { console.log(`Node server listening on http://localhost:${PORT}`); });
./webpack.server.config.js
// Work around for https://github.com/angular/angular-cli/issues/7200 const path = require('path'); const webpack = require('webpack'); const nodeExternals = require('webpack-node-externals'); module.exports = { mode: 'none', entry: { // This is our Express server for Dynamic universal server: './server.ts', // This is an example of Static prerendering (generative) }, target: 'node', resolve: { extensions: ['.ts', '.js'] }, // Make sure we include all node_modules etc externals: [/node_modules/, nodeExternals({ whitelist: [ /^@agm/core/, /^hammerjs/ ] })], output: { // Puts the output at the root of the dist folder path: path.join(__dirname, 'dist'), filename: '[name].js' }, module: { rules: [ { test: /.ts$/, loader: 'ts-loader' }, { // Mark files inside `@angular/core` as using SystemJS style dynamic imports. // Removing this will cause deprecation warnings to appear. test: /[/\]@angular[/\]core[/\].+.js$/, parser: { system: true }, }, ] }, plugins: [ new webpack.ContextReplacementPlugin( // fixes WARNING Critical dependency: the request of a dependency is an expression /(.+)?angular(\|/)core(.+)?/, path.join(__dirname, 'src'), // location of your src {} // a map of your routes ), new webpack.ContextReplacementPlugin( // fixes WARNING Critical dependency: the request of a dependency is an expression /(.+)?express(\|/)(.+)?/, path.join(__dirname, 'src'), {} ) ] }
package.json
{ "name": "mdb-angular-free", "version": "6.1.1", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "build:client-and-server-bundles": "ng build --prod && ng run project-name:server:production", "webpack:server": "webpack --config webpack.server.config.js --progress --colors", "build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server", "serve:ssr": "node dist/server" }, "private": true, "dependencies": { "@agm/core": "^1.0.0-beta.2", "@angular/animations": "^6.0.4", "@angular/common": "^6.0.0-rc.1", "@angular/compiler": "^6.0.0-rc.1", "@angular/core": "^6.0.0-rc.1", "@angular/forms": "^6.0.0-rc.1", "@angular/http": "^6.0.0-rc.1", "@angular/platform-browser": "^6.0.0-rc.1", "@angular/platform-browser-dynamic": "^6.0.0-rc.1", "@angular/platform-server": "^6.0.9", "@angular/pwa": "^0.7.1", "@angular/router": "^6.0.0-rc.1", "@angular/service-worker": "^6.0.0", "@nguniversal/express-engine": "^6.0.0", "@nguniversal/module-map-ngfactory-loader": "^6.0.0", "angular-mgl-timeline": "^0.1.8", "chart.js": "^2.5.0", "classlist.js": "^1.1.20150312", "core-js": "^2.4.1", "font-awesome": "^4.7.0", "hammerjs": "^2.0.8", "ng2-sticky-kit": "^5.3.0", "ngx-pagination": "^3.1.1", "ngx-spinner": "^6.0.0", "ngx-toastr": "^8.8.0", "node-sass": "^4.9.1", "rxjs": "^6.0.0-rc.1", "ts-loader": "^4.4.2", "web-animations-js": "^2.3.1", "zone.js": "^0.8.19" }, "devDependencies": { "@angular-devkit/build-angular": "^0.5.7", "@angular/cli": "^6.0.0-rc.1", "@angular/compiler-cli": "^6.0.0-rc.1", "@angular/language-service": "^6.0.0-rc.1", "@types/jasmine": "~2.8.3", "@types/jasminewd2": "~2.0.2", "@types/node": "~6.0.60", "codelyzer": "^4.0.1", "jasmine-core": "~2.8.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~2.0.0", "karma-chrome-launcher": "~2.2.0", "karma-cli": "~1.0.1", "karma-coverage-istanbul-reporter": "^1.2.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.2", "ts-node": "~4.1.0", "tslint": "~5.9.1", "typescript": "~2.7.2" } }
angular.json
{ "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json", "version": 1, "newProjectRoot": "projects", "projects": { "mdb-angular-free": { "root": "", "sourceRoot": "src", "projectType": "application", "prefix": "app", "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { "outputPath": "dist/browser", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.app.json", "assets": [ { "glob": "favicon.ico", "input": "src", "output": "/" }, { "glob": "**/*", "input": "src/assets", "output": "/assets" }, { "glob": "robots.txt", "input": "src", "output": "/" }, { "glob": "sitemap.xml", "input": "src", "output": "/" } ], "styles": [{ "input": "node_modules/font-awesome/scss/font-awesome.scss", "input": "node_modules/ngx-toastr/toastr.css" }, { "input": "angular-bootstrap-md/scss/bootstrap/bootstrap.scss" }, { "input": "angular-bootstrap-md/scss/mdb-free.scss" }, { "input": "src/styles.scss" } ], "scripts": [{ "input": "node_modules/chart.js/dist/Chart.js" }, { "input": "node_modules/hammerjs/hammer.min.js" } ] }, "configurations": { "production": { "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ], "optimization": true, "outputHashing": "all", "sourceMap": false, "extractCss": true, "namedChunks": false, "aot": true, "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true } } }, "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { "browserTarget": "mdb-angular-free:build" }, "configurations": { "production": { "browserTarget": "mdb-angular-free:build:production" } } }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { "browserTarget": "mdb-angular-free:build" } }, "test": { "builder": "@angular-devkit/build-angular:karma", "options": { "main": "src/test.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.spec.json", "karmaConfig": "src/karma.conf.js", "styles": [ { "input": "styles.scss" } ], "scripts": [], "assets": [ { "glob": "favicon.ico", "input": "src/", "output": "/" }, { "glob": "**/*", "input": "src/assets", "output": "/assets" } ] } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": [ "src/tsconfig.app.json", "src/tsconfig.spec.json" ], "exclude": [ "**/node_modules/**" ] } }, "server": { "builder": "@angular-devkit/build-angular:server", "options": { "outputPath": "dist/server", "main": "src/main.server.ts", "tsConfig": "src/tsconfig.server.json" }, "configurations": { "production": { "fileReplacements": [{ "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" }] } } } } }, "mdb-angular-free-e2e": { "root": "e2e/", "projectType": "application", "architect": { "e2e": { "builder": "@angular-devkit/build-angular:protractor", "options": { "protractorConfig": "e2e/protractor.conf.js", "devServerTarget": "mdb-angular-free:serve" } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": "e2e/tsconfig.e2e.json", "exclude": [ "**/node_modules/**" ] } } } } }, "schematics": { "@schematics/angular:component": { "styleext": "scss" } }, "defaultProject": "mdb-angular-free" }
Hector Alejandro Rodriguez answered 6 years ago
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: Yes