Deploying Google App Engine Nest.js via Bitbucket Pipelines - google-app-engine

In my current setup, I use Bitbucket Pipelines to deploy a Nest.js backend to Google App Engine. Unfortunately, I haven't gotten my NestJS backend up and running yet. Before I had the same setup with a simple Express.js backend which worked without problems.
The problem is as follows and I am now at a loss as to what else to try:
Here's my bitbucket-pipelines.yaml:
image: node:16.15.0
pipelines:
branches:
master:
- step:
name: Install Dependencies & Build Application
script:
- npm install
- npm run build
- step:
name: Deploy to Google App Engine
deployment: development
script:
- pipe: atlassian/google-app-engine-deploy:1.0.0
variables:
KEY_FILE: $KEY_FILE
PROJECT: 'example-project'
VERSION: 'development'
DEPLOYABLES: 'default.yaml'
STOP_PREVIOUS_VERSION: 'true'
Here's my package.json:
{
"name": "example-project",
"version": "0.0.1",
"description": "",
"author": "",
"private": true,
"license": "UNLICENSED",
"scripts": {
"prebuild": "rimraf dist",
"build": "nest build",
"format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
"start": "NODE_ENV=production node dist/main",
"start:dev": "NODE_ENV=development nest start --watch",
"start:stage": "NODE_ENV=stage nest start --watch",
"start:release": "NODE_ENV=release nest start --watch",
"start:prod": "NODE_ENV=production node dist/main",
"start:debug": "nest start --debug --watch",
"db": "../../cloud_sql_proxy -instances=example-project=tcp:3306",
"lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json"
},
"dependencies": {
"#hapi/joi": "^17.1.1",
"#nestjs/cli": "^8.0.0",
"#nestjs/common": "^8.0.0",
"#nestjs/config": "^2.0.0",
"#nestjs/core": "^8.0.0",
"#nestjs/mapped-types": "^1.0.1",
"#nestjs/platform-express": "^8.0.0",
"#nestjs/typeorm": "^8.0.3",
"buffer-to-stream": "^1.0.0",
"class-transformer": "^0.5.1",
"class-validator": "^0.13.2",
"cloudinary": "^1.30.0",
"firebase-admin": "^10.2.0",
"module-alias": "^2.2.2",
"mysql": "^2.18.1",
"pg": "^8.7.3",
"portfinder": "^1.0.28",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^7.2.0",
"typeorm": "^0.2.45",
"typeorm-naming-strategies": "^4.1.0"
},
"devDependencies": {
"#nestjs/schematics": "^8.0.0",
"#nestjs/testing": "^8.0.0",
"#types/express": "^4.17.13",
"#types/hapi__joi": "^17.1.8",
"#types/jest": "27.4.1",
"#types/multer": "^1.4.7",
"#types/node": "^16.0.0",
"#types/supertest": "^2.0.11",
"#typescript-eslint/eslint-plugin": "^5.0.0",
"#typescript-eslint/parser": "^5.0.0",
"eslint": "^8.0.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"jest": "^27.2.5",
"prettier": "^2.3.2",
"source-map-support": "^0.5.20",
"supertest": "^6.1.3",
"ts-jest": "^27.0.3",
"ts-loader": "^9.2.3",
"ts-node": "^10.0.0",
"tsconfig-paths": "^3.10.1",
"typescript": "^4.3.5"
},
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "src",
"testRegex": ".*\\.spec\\.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"collectCoverageFrom": [
"**/*.(t|j)s"
],
"coverageDirectory": "../coverage",
"testEnvironment": "node"
}
}
Maybe someone has already made experiences with this stack and can help me.

Related

Next.js not friendly when checking with google mobile-friendly

My site is not mobile friendly when testing with Google Mobile friendly. But actually when accessing it, it is mobile friendly.
What should I do to fix it? I am using Next.js.
Result when I test: https://search.google.com/test/mobile-friendly/result?id=zwleJJ0VXRiIwFagHtBHuA
My package.json:
{
"name": "tintuc",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev -p 8080",
"build": "next build",
"start": "next start -p 8080",
"sitemap": "next-sitemap",
"analyze": "cross-env ANALYZE=true next build",
"analyze:server": "cross-env BUNDLE_ANALYZE=server next build",
"analyze:browser": "cross-env BUNDLE_ANALYZE=browser next build",
"find:unused": "next-unused",
"depcheck": "npx depcheck"
},
"dependencies": {
"#apollo/client": "^3.3.19",
"#headlessui/react": "^1.4.1",
"#heroicons/react": "^1.0.4",
"date-fns": "^2.25.0",
"deepmerge": "^4.2.2",
"graphql": "^15.5.0",
"highlight.js": "^11.6.0",
"html-react-parser": "^3.0.4",
"lodash": "^4.17.21",
"next": "^12.2.5",
"next-seo": "^4.28.1",
"node-html-parser": "^5.0.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-loading-skeleton": "^2.2.0",
"replace-special-characters": "^1.2.6"
},
"devDependencies": {
"#next/bundle-analyzer": "^11.1.4",
"#types/node": "^18.11.0",
"#types/react": "^18.0.21",
"autoprefixer": "^10.3.6",
"next-pwa": "^5.6.0",
"next-sitemap": "^3.1.29",
"next-unused": "^0.0.6",
"postcss": "^8.3.8",
"tailwindcss": "^2.2.16"
}
}

does the interface parameter name must be the same with model namespaces in react

I am defined the functional properties in model like this:
export interface IIapProductProps {
iapproducts: IIapProductState,
dispatch: Dispatch
loading: boolean
}
and this is the model:
interface IIapProductModel {
namespace: 'iapproduct'
state: IIapProductState
reducers: {
getPage: Reducer<IIapProductState>,
getList: Reducer<IIapProductState>,
edit:Reducer<IIapProductState>,
add: Reducer<IIapProductState>,
}
effects: {
getIapProductPage: Effect,
getProductList: Effect,
editProduct: Effect,
addProduct: Effect
}
subscriptions: {
setup: Subscription
}
}
does the IIapProductProps first parameter name must be the same with the namespace's name? I found when I changed the namespace to iapproduct, the properties iapproducts must be the same with the model namespace. this is the package.json:
{
"name": "ant-design-pro",
"version": "5.2.0",
"private": true,
"description": "An out-of-box UI solution for enterprise applications",
"scripts": {
"analyze": "cross-env ANALYZE=1 umi build",
"build": "umi build",
"deploy": "npm run build && npm run gh-pages",
"dev": "npm run start:dev",
"gh-pages": "gh-pages -d dist",
"i18n-remove": "pro i18n-remove --locale=zh-CN --write",
"postinstall": "umi g tmp",
"lint": "umi g tmp && npm run lint:js && npm run lint:style && npm run lint:prettier && npm run tsc",
"lint-staged": "lint-staged",
"lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx ",
"lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src && npm run lint:style",
"lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
"lint:prettier": "prettier -c --write \"src/**/*\" --end-of-line auto",
"lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
"openapi": "umi openapi",
"playwright": "playwright install && playwright test",
"precommit": "lint-staged",
"prettier": "prettier -c --write \"src/**/*\"",
"serve": "umi-serve",
"start": "cross-env UMI_ENV=dev umi dev",
"start:dev": "cross-env REACT_APP_ENV=dev MOCK=none UMI_ENV=dev umi dev",
"start:no-mock": "cross-env MOCK=none UMI_ENV=dev umi dev",
"start:no-ui": "cross-env UMI_UI=none UMI_ENV=dev umi dev",
"start:pre": "cross-env REACT_APP_ENV=pre UMI_ENV=dev umi dev",
"start:test": "cross-env REACT_APP_ENV=test MOCK=none UMI_ENV=dev umi dev",
"test": "umi test",
"test:component": "umi test ./src/components",
"test:e2e": "node ./tests/run-tests.js",
"tsc": "tsc --noEmit"
},
"lint-staged": {
"**/*.less": "stylelint --syntax less",
"**/*.{js,jsx,ts,tsx}": "npm run lint-staged:js",
"**/*.{js,jsx,tsx,ts,less,md,json}": [
"prettier --write"
]
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 10"
],
"dependencies": {
"#ant-design/icons": "^4.7.0",
"#ant-design/pro-components": "^1.1.14",
"#ant-design/pro-descriptions": "^1.10.0",
"#ant-design/pro-form": "^1.52.0",
"#ant-design/pro-layout": "^6.32.0",
"#ant-design/pro-table": "2.72.1",
"#loadable/component": "^5.15.2",
"#types/crypto-js": "^4.1.1",
"#types/react-loadable": "^5.5.6",
"#umijs/route-utils": "^2.0.0",
"antd": "^4.17.0",
"classnames": "^2.3.0",
"crypto-js": "^4.1.1",
"dayjs": "^1.11.1",
"echarts": "^5.3.3",
"echarts-for-react": "^3.0.2",
"js-wheel": "https://github.com/jiangxiaoqiang/js-wheel.git",
"lodash": "^4.17.0",
"moment": "^2.29.0",
"omit.js": "^2.0.2",
"rc-menu": "^9.1.0",
"rc-util": "^5.16.0",
"react": "^17.0.0",
"react-dev-inspector": "^1.7.0",
"react-dom": "^17.0.0",
"react-helmet-async": "^1.2.0",
"react-loadable": "^5.5.0",
"react-native-aes-crypto": "^2.1.0",
"react-router": "^6.3.0",
"react-router-dom": "^6.3.0",
"umi": "3.5.0",
"umi-request": "^1.4.0",
"uuid": "^8.3.2"
},
"devDependencies": {
"#ant-design/pro-cli": "^2.1.0",
"#playwright/test": "^1.17.0",
"#types/express": "^4.17.0",
"#types/history": "^4.7.0",
"#types/jest": "^26.0.0",
"#types/lodash": "^4.14.0",
"#types/react": "^17.0.0",
"#types/react-dom": "^17.0.0",
"#types/react-helmet": "^6.1.0",
"#types/react-router": "^5.1.18",
"#types/react-router-dom": "^5.3.3",
"#umijs/fabric": "^2.8.0",
"#umijs/openapi": "^1.3.0",
"#umijs/plugin-blocks": "^2.2.0",
"#umijs/plugin-esbuild": "^1.4.0",
"#umijs/plugin-openapi": "^1.3.0",
"#umijs/preset-ant-design-pro": "^1.3.0",
"#umijs/preset-dumi": "^1.1.0",
"#umijs/preset-react": "^1.8.17",
"#umijs/yorkie": "^2.0.5",
"carlo": "^0.9.46",
"cross-env": "^7.0.0",
"cross-port-killer": "^1.3.0",
"detect-installer": "^1.0.0",
"enzyme": "^3.11.0",
"eslint": "^7.32.0",
"express": "^4.17.0",
"gh-pages": "^3.2.0",
"jsdom-global": "^3.0.0",
"lint-staged": "^10.0.0",
"mockjs": "^1.1.0",
"prettier": "^2.5.0",
"puppeteer-core": "^8.0.0",
"stylelint": "^13.0.0",
"swagger-ui-react": "^4.12.0",
"typescript": "^4.5.0",
"umi-serve": "^1.9.10"
},
"engines": {
"node": ">=10.0.0"
},
"gitHooks": {
"commit-msg": "fabric verify-commit"
}
}

tiny-warning : "Uncaught Error: Module build failed: Error: ENOENT: no such file or directory"

I just started a new project using React with Webpack. I keep getting the same error when serving the app.
Uncaught Error: Module build failed: Error: ENOENT: no such file or directory, open 'C:\workwork\apol2\apol2\node_modules\webpack\buildin\global.js'
at Object. (tiny-warning.esm.js:20)
at webpack_require (bootstrap 73c6a5b3e608efed68ac:19)
at Object. (scheduler.development.js:699)
at webpack_require (bootstrap 73c6a5b3e608efed68ac:19)
at Object. (index.js:6)
at Object. (index.js:7)
at webpack_require (bootstrap 73c6a5b3e608efed68ac:19)
at react-dom.development.js:21
at Object. (react-dom.development.js:21277)
at Object. (react-dom.development.js:21278)
This is not a package I installed and I don't know where to begin to debug this.. Could it be one of the package I use?
{
"name": "demo",
"version": "1.0.0",
"description": "",
"scripts": {
"build": "babel ./app -d build",
"build:watch": "babel ./app -d build --watch",
"build:client": "webpack --config ./webpack.config.js/",
"build:watch:client": "webpack --config ./webpack.config.js/ --watch",
"build:prod": "npm run build && npm run build:client",
"start": "npm run build:prod && NODE_ENV=production node ./build/server/index.js",
"start:dev": "parallelshell \"npm run build:watch\" \"npm run build:watch:client\" \"nodemon ./build/server/index.js\"",
"test": "jest --watch --coverage"
},
"author": "",
"license": "ISC",
"jest": {
"testMatch": [
"**/?(*.)+(spec|test).[jt]s?(x)"
],
"testPathIgnorePatterns": [
"/build/"
],
"modulePathIgnorePatterns": [
"/build/"
],
"snapshotSerializers": [
"enzyme-to-json/serializer"
],
"coverageThreshold": {
"global": {
"branches": 90,
"functions": 90,
"lines": 90,
"statements": 90
}
},
"setupFilesAfterEnv": [
"<rootDir>setupTests.js"
]
},
"dependencies": {
"#babel/cli": "^7.5.5",
"#babel/core": "^7.5.5",
"#babel/preset-env": "^7.5.5",
"#babel/preset-react": "^7.0.0",
"assert": "^2.0.0",
"axios": "^0.19.0",
"babel-loader": "^8.0.6",
"cors": "^2.8.4",
"express": "^4.15.3",
"fs": "0.0.2",
"html-webpack-plugin": "^3.2.0",
"https": "^1.0.0",
"mongodb": "^3.3.0-beta2",
"parallelshell": "^3.0.1",
"react": "^16.8.6",
"react-dom": "^16.10.2",
"react-router-dom": "^5.0.1",
"scheduler": "^0.16.2",
"webpack": "^4.41.1"
},
"devDependencies": {
"babel-jest": "^24.8.0",
"enzyme": "^3.10.0",
"enzyme-adapter-react-16": "^1.14.0",
"enzyme-to-json": "^3.3.5",
"eslint": "^6.1.0",
"eslint-config-airbnb": "^17.1.1",
"eslint-plugin-import": "^2.11.0",
"eslint-plugin-jsx-a11y": "^6.0.3",
"eslint-plugin-react": "^7.7.0",
"jest": "^24.8.0",
"nodemon": "^1.11.0",
"react-test-renderer": "^16.8.6",
"supertest": "^4.0.2"
}
}
After deleting my folder node_modules several times between my tests, the error disapeared...
Webpack is not installed, make sure install webpack or do npm install

Images loading blurred or not loading - Gatsby and GitHub Pages

I am super new to gatsby and it's been a while since i touched any kind of web development project.
I am trying to create a photography portfolio using this gatsby template
https://github.com/LekoArts/gatsby-starter-portfolio-emilia and my github account (github pages).
The problem is in the main page the image im using as cover picture doesn't load and in the album I'm either getting a blurred version or a weird grayscale version. In development they work just fine.
I'm running on MacOS High Sierra and have tried Firefox, Chrome and Safari. (not sure if relevant)
Here are some dev v. deploy pictures.
I'll post some of the code; but if it's not enough just ask me about something and I'll update the question. I'm really not sure where to begin debugging.
This is my package.json
{
"name": "photos",
"description": "photo portfolio",
"version": "3.0.0",
"author": "Alex Ingberg (hi#alexingberg.com)",
"scripts": {
"develop": "gatsby develop",
"dev": "gatsby develop -o",
"build": "gatsby build",
"serve": "gatsby serve",
"deploy": "gatsby build && gh-pages -d public --branch master",
"lint": "eslint . --ext .js,.jsx --ignore-path .gitignore",
"lint:fix": "eslint . --ext .js,.jsx --fix --ignore-path .gitignore",
"format": "prettier \"**/*.{md,mdx} \" --write",
"lint:ci": "yarn lint --format junit -o results/eslint/result.xml",
"cy:open": "cypress open",
"cy:run": "cypress run",
"cy:run:ci": "cypress run --browser chrome --reporter junit --reporter-options 'mochaFile=results/cypress/result.xml'",
"test:e2e:dev": "cross-env CYPRESS_SUPPORT=y start-server-and-test dev http://localhost:8000 cy:open",
"test:e2e:run": "cross-env CYPRESS_SUPPORT=y start-server-and-test develop http://localhost:8000 cy:run",
"test:e2e:ci": "cross-env CYPRESS_SUPPORT=y start-server-and-test develop http://localhost:8000 cy:run:ci"
},
"dependencies": {
"#fortawesome/fontawesome-free": "^5.6.3",
"#fortawesome/fontawesome-svg-core": "^1.2.17",
"#mdx-js/mdx": "^1.0.10",
"#mdx-js/react": "^1.0.6",
"babel-plugin-styled-components": "^1.10.0",
"font-awesome": "^4.7.0",
"gatsby": "^2.9.11",
"gatsby-image": "^2.1.4",
"gatsby-mdx": "^0.6.2",
"gatsby-plugin-google-analytics": "^2.0.18",
"gatsby-plugin-lodash": "^3.0.5",
"gatsby-plugin-manifest": "^2.0.29",
"gatsby-plugin-netlify": "^2.0.14",
"gatsby-plugin-offline": "^2.0.25",
"gatsby-plugin-react-helmet": "^3.0.12",
"gatsby-plugin-sharp": "^2.0.35",
"gatsby-plugin-sitemap": "^2.0.12",
"gatsby-plugin-styled-components": "^3.0.7",
"gatsby-remark-external-links": "^0.0.4",
"gatsby-source-filesystem": "^2.0.29",
"gatsby-transformer-sharp": "^2.1.18",
"gh-pages": "^2.0.1",
"lodash": "^4.17.11",
"polished": "^3.2.0",
"prop-types": "^15.7.2",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-helmet": "^5.2.0",
"react-spring": "^8.0.19",
"styled-components": "^4.2.0",
"styled-theming": "^2.2.0",
"typeface-fira-sans": "^0.0.54",
"typeface-montserrat": "^0.0.54"
},
"devDependencies": {
"babel-eslint": "^10.0.1",
"cross-env": "^5.2.0",
"cypress": "^3.2.0",
"cypress-testing-library": "^2.4.0",
"eslint": "^5.16.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-config-prettier": "^4.1.0",
"eslint-plugin-cypress": "^2.2.1",
"eslint-plugin-import": "^2.17.2",
"eslint-plugin-jsx-a11y": "^6.2.1",
"eslint-plugin-prettier": "^3.0.1",
"eslint-plugin-react": "^7.12.4",
"#fortawesome/fontawesome-free": "^5.6.3",
"gatsby-cypress": "^0.1.8",
"prettier": "^1.17.0",
"start-server-and-test": "^1.7.13"
},
"homepage": "https://www.alexingberg.com/photos",
"bugs": {
"url": "https://github.com/alexing/photos/issues"
},
"keywords": [
"gatsby",
"gatsby-starter",
"gatsby-starter-portfolio",
"alexing"
],
"license": "MIT",
"main": "n/a",
"repository": {
"type": "git",
"url": "git+https://github.com/alexing/photos.git"
}
}
Also, in the develop branch of my repo you can find the complete source code.
https://github.com/alexing/photos/tree/develop
Thanks a million.

Angular Cannot find name 'Angular' Visual Studio 2015 Dotnet MVC web app

So I am new in angular and i am working on visual studio 2015 update 3.
Simple Angular app work perfectly on VS2015 dotnet MVC project.
I have a problem when i downgradecomponent in app.module.ts file
angular.module('app').directive('viewTest', downgradeComponent({ component: ViewTestComponent }));
error is on angular it says cannot find name 'angular'
my package.json file
{
"name": "angular-quickstart",
"version": "1.0.0",
"description": "QuickStart package.json from the documentation, supplemented with testing support",
"scripts": {
"build": "tsc -p src/",
"build:watch": "tsc -p src/ -w",
"build:e2e": "tsc -p e2e/",
"serve": "lite-server -c=bs-config.json",
"serve:e2e": "lite-server -c=bs-config.e2e.json",
"prestart": "npm run build",
"start": "concurrently \"npm run build:watch\" \"npm run serve\"",
"pree2e": "npm run build:e2e",
"e2e": "concurrently \"npm run serve:e2e\" \"npm run protractor\" --kill-others --success first",
"preprotractor": "webdriver-manager update",
"protractor": "protractor protractor.config.js",
"pretest": "npm run build",
"test": "concurrently \"npm run build:watch\" \"karma start karma.conf.js\"",
"pretest:once": "npm run build",
"test:once": "karma start karma.conf.js --single-run",
"lint": "tslint ./src/**/*.ts -t verbose"
},
"keywords": [],
"author": "",
"license": "MIT",
"dependencies": {
"#angular/common": "~4.3.4",
"#angular/compiler": "~4.3.4",
"#angular/core": "~4.3.4",
"#angular/forms": "~4.3.4",
"#angular/http": "~4.3.4",
"#angular/platform-browser": "~4.3.4",
"#angular/platform-browser-dynamic": "~4.3.4",
"#angular/router": "~4.3.4",
"#angular/upgrade": "~4.3.4",
"angular-in-memory-web-api": "~0.3.0",
"systemjs": "0.19.40",
"core-js": "^2.4.1",
"rxjs": "5.5.10",
"zone.js": "^0.8.4"
},
"devDependencies": {
"concurrently": "^3.2.0",
"lite-server": "^2.2.2",
"typescript": "~2.8.1",
"canonical-path": "0.0.2",
"tslint": "^3.15.1",
"lodash": "^4.16.4",
"jasmine-core": "~2.4.1",
"karma": "^1.3.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~4.0.14",
"rimraf": "^2.5.4",
"#types/node": "^6.0.46",
"#types/jasmine": "2.5.36"
},
"repository": {}
}
I also declare this.
declare var angular: any;
by doing that project run with no error. but nothing is rendering.
when i inspect element in browser it show me the converted component but not rendering any other angularjs component.
need help thanks

Resources