Publish js project to Google Appengine, using yarn workspaces, without publishing packages to npm registry - google-app-engine

I have one repository on GitHub. It includes common packages, an API and a web app.
In the API and in the web app I use the common packages. For that I use yarn workspaces. So I can give the common packages a name in their package.json files and then use them by "common-package-name": "*". This works locally.
I have app.yaml files in the API and in the web app directory. I use GitHub actions to deploy the two apps. But I get the following error:
npm ERR! 404 Not Found - GET https://registry.npmjs.org/#bujus%!f(MISSING)common - Not found
npm ERR! 404
npm ERR! 404 '#bujus/common#*' is not in this registry.
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.
#bujus/common is the first common package.
I do not have pushed the common packages to npm registry and do not want to do so. Is there a solution to this?
In addition, I build the app in the GitHub action and thought that Appengine would just execute the start command which would execute the build files in the dist folder, but apparently it wants to install or just check the dependencies.
The root package.json:
{
"name": "#bujus/root",
"version": "1.0.0",
"private": true,
"license": "UNLICENSED",
"workspaces": [
"tool-presets",
"common",
"common-frontend",
"api",
"school-app"
],
"scripts": {
"build-development": "turbo run build-development",
"build-production": "turbo run build-production",
"lint": "turbo run lint --continue",
"prettify": "turbo run prettify --continue",
"start-development": "turbo run start-development",
"test": "turbo run test"
},
"devDependencies": {
"#bujus/tool-presets": "*",
...
},
"packageManager": "yarn#1.22.17"
}
The common package.json
{
"name": "#bujus/common",
"version": "1.0.0",
"license": "UNLICENSED",
"main": "./dist/common.es.js",
"scripts": {
"build-development": "vite build --mode development",
"build-production": "vite build",
"lint": "eslint --fix --ext .html,.js .",
"prettify": "prettier --write \"./**/*.{html,js}\""
},
"dependencies": {
...
}
}
The webapp package.json
{
"name": "#bujus/school-app",
"version": "1.0.0",
"license": "UNLICENSED",
"scripts": {
"build-production": "vite build",
"lint": "eslint --fix --ext .html,.js,.jsx .",
"prettify": "prettier --write \"./**/*.{html,js,jsx}\"",
"start-development": "vite"
},
"dependencies": {
"#bujus/common": "*",
"#bujus/common-frontend": "*",
...
}
}

Related

when i try to run the project with library #google/model-viewer by npm start i get this error

this is my package.json
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#google/model-viewer": "^1.11.0",
"react": "^18.0.0"
}
}
`PS C:\Users\AA\Desktop\3Dpro\my-app> npm start
npm ERR! Missing script: "start"
npm ERR!
npm ERR! Did you mean one of these?
npm ERR! npm star # Mark your favorite packages
npm ERR! npm stars # View packages marked as favorites
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\AA\AppData\Local\npm-cache_logs\2022-04-05T20_22_54_567Z-debug-0.log
PS C:\Users\AA\Desktop\3Dpro\my-app>
I am using a library for 3D ( #google/model-viewer)
this is my code:
import '#google/model-viewer'
import React, { Component } from 'react'
export default class PersonalDesign extends Component {
render() {
return (
)
}
}
Looks like your package.json file is missing the scripts for some reason. Add them back in. You also appear to be missing the react-dom and react-scripts dependencies.
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#google/model-viewer": "^1.11.0",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-scripts": "^4.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
After updating/saving your package.json file, run npm i to install the dependencies and then run npm start to start your project.

Deploy Next.JS web-app that used Yarn to Google App Engine

I'm trying to deploy a web-app that I've built using templates from a friend. I'm quite unfamiliar with React/NextJS frameworks so I'm unsure with the differences between yarn and npx.
I've used yarn next-build to get the app running locally and it works fine. However, now I'm trying to deploy it to Google App Engine on NodeJS and I can't get it working.
This is the project structure:
/dist/functions/next
/nginx
/node_modules
/packages
/public
.gcloudignore
.nowignore
.prettierrc
.yarnrc
app.yaml
babel.config.js
firebase.json
landing.now.json
lerna.json
package-lock.json
package.json
yarn.lock
This is app.yaml:
runtime: nodejs10
handlers:
- url: /.*
script: auto
This is package.json:
{
"name": "streamplate-landing",
"description": "Your universal health app",
"version": "1.0.0",
"private": true,
"author": "Streamplate",
"devDependencies": {
"#babel/cli": "^7.10.3",
"cpx": "^1.5.0",
"cross-env": "^7.0.2",
"firebase-tools": "8.4.3",
"husky": "^4.2.5",
"lerna": "^3.22.1",
"lint-staged": "^10.2.11",
"prettier": "^2.0.5",
"rimraf": "^3.0.2",
"polished": "^3.4.4"
},
"workspaces": [
"packages/common",
"packages/landing",
"packages/landing-gatsby"
],
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start",
"clean": "lerna clean --yes && rimraf node_modules",
"preweb": "cpx \"packages/common/src/assets/image/**/*.*\" \"packages/landing/static\" -C",
"next-dev": "yarn workspace next-landing run dev",
"next-build": "rimraf dist && yarn workspace next-landing run build",
"next-start": "yarn workspace next-landing run start",
"next-export": "yarn workspace next-landing run export",
"gatsby-dev": "yarn workspace gatsby-landing run dev",
"gatsby-build": "yarn workspace gatsby-landing run build",
"gatsby-serve": "yarn workspace gatsby-landing run serve",
"prebuild-public": "rimraf \"dist/functions/**\" && rimraf \"dist/public\"",
"prefirebase-serve": "yarn run build-public && yarn run build-funcs && yarn workspace next-
landing run build && yarn run copy-deps && yarn run install-deps",
"firebase-serve": "cross-env NODE_ENV=production firebase serve",
"prefirebase-deploy": "yarn run build-public && yarn run build-funcs && yarn workspace next-
landing run build && yarn run copy-deps",
"firebase-deploy": "cross-env NODE_ENV=production firebase deploy",
"build-public": "cpx \"packages/common/src/assets/**/*.*\" \"dist/public/static\" -C && cpx
\"public/**/*.*\" \"dist/public\" -C && cpx \"packages/landing/public/**/*.*\"
\"dist/public\" -C",
"build-funcs": "babel \"packages/functions\" --out-dir \"dist/functions\"",
"copy-deps": "cpx \"packages/landing/*{package.json,package-lock.json,yarn.lock}\"
\"dist/functions\" -C",
"install-deps": "cd \"dist/functions\" && yarn",
"pregatsby-firebase-serve": "rimraf dist && yarn run gatsby-build && cpx \"packages/landing-
gatsby/public/**/*.*\" \"dist/public\" -C",
"gatsby-firebase-serve": "cross-env NODE_ENV=production firebase serve",
"pregatsby-firebase-deploy": "rimraf dist && yarn run gatsby-build && cpx
\"packages/landing-gatsby/public/**/*.*\" \"dist/public\" -C",
"gatsby-firebase-deploy": "firebase deploy",
"netlify-deploy": "yarn workspace next-landing run netlify-build"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,md,css}": [
"prettier --trailing-comma es5 --single-quote --write"
]
}
}
Add the next export into scripts area in your package.json
"scripts": {
...
"build": "next build && next export"
...
after execution yarn build the out directory will be generated and added into your project.
While initializing firebase use out directory as your public.

Heroku express + react + webpack - can't run on server

I have my webpack + ts + express + react application. I can build it locally without any problems. . And everything works, but when i publish it to heroku i've got this:
eb.1]: npm ERR! code ELIFECYCLE
2019-11-06T15:32:36.057014+00:00 app[web.1]: npm ERR! errno 2
2019-11-06T15:32:36.058319+00:00 app[web.1]: npm ERR! v#0.0.0 start: tsc && node ./build/app.js
2019-11-06T15:32:36.058526+00:00 app[web.1]: npm ERR! Exit status 2
2019-11-06T15:32:36.058771+00:00 app[web.1]: npm ERR!
2019-11-06T15:32:36.058897+00:00 app[web.1]: npm ERR! Failed at the v#0.0.0
start script.
2019-11-06T15:32:36.059048+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Folder structure
api
app.ts
client
src
tsconfig
package.json
tsconfig
package.json
file app.ts
app.use(cors());
app.use(morgan('dev'));
app.use(express.json());
app.use(cookieParser());
app.use(morgan('dev'));
app.use(express.static(path.join(__dirname, '../client/build')));
app.use('/api/posts', postRoutes);
app.use('/api/users', userRoutes);
app.use('/api', errorRoutes);
app.get('/*', (req, res: Response) => {
res.sendFile(path.join(__dirname, '../client/build/index.html'));
});
const port = process.env.PORT || 1646;
app.listen(port, () => {
// tslint:disable-next-line: no-console
console.log(`listening on port ${port}`);
});
{
"name": "v",
"version": "0.0.0",
"engines": {
"node": "8.11.2",
"npm": "5.6.0"
},
"private": true,
"scripts": {
"dev:front": "cd client && npm run dev",
"dev:server": "ts-node-dev --respawn --transpileOnly ./api/app.ts",
"dev": "concurrently \"npm run dev:server\" \"npm run dev:front\"",
"tsc": "tsc",
"start": "tsc && node ./build/app.js",
"clean": "rimraf ./build",
"build": "tsc && node ./build/app.js",
"heroku-postbuild": "cd client && npm run build",
"heroku-prebuild": "cd client && npm install"
},
"dependencies": { //I Putted evrything here to dependencies
"#material-ui/lab": "^4.0.0-alpha.30",
"cookie-parser": "~1.4.4",
"cors": "^2.8.5",",
"dotenv": "^8.2.0", ....
tsconfig
"target": "es6"
"module": "commonjs"
"outDir": "./build",
"include": [
"api/"
]
package.json client
scripts ...
"build": "npm run clean && webpack -p ---open --config webpack/production.js",
"clean": "rimraf build/*",
"tsc": "tsc --noEmit",
"lint": "tslint './src/**/*.ts*' --format stylish --project . --force",
"dev": "webpack-dev-server ---open --config webpack/development.js"
Your build process shouldn't be starting up your app. Change
"heroku-postbuild": "cd client && npm run build",
to
"heroku-postbuild": "npm run tsc",
That should create the build folder you want. Then you'll want to add a new file called Procfile to the root of your project with this line of code:
web: node build/api.js
Which tells Heroku how to start up your app.

I'm trying to deploy my Gatsby Blog on Github pages, but "npm run deploy" returns error

I tried to build and deploy my Gatsby blog on github pages.
I followed Gatsby's docs about deploy: https://www.gatsbyjs.org/docs/deploy-gatsby/
I run the following command:
npm run deploy
I encountered:
Cannot read property 'email' of null
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! gatsby-starter-hello-world# deploy: `gatsby build && gh-pages -b master -d public`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the gatsby-starter-hello-world# deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/ChaewonKong/.npm/_logs/2018-09-20T09_34_57_114Z-debug.log
This is my gatsby-config.js looks like:
module.exports = {
siteMetadata: {
title: `Leon Kong's Blog`
},
plugins: [
{
resolve: `gatsby-source-filesystem`,
options: {
name: `src`,
path: `${__dirname}/src/`
}
},
`gatsby-transformer-remark`
]
};
This is my package.json:
{
"name": "gatsby-starter-hello-world",
"description": "Gatsby hello world starter",
"license": "MIT",
"scripts": {
"develop": "gatsby develop",
"build": "gatsby build",
"serve": "gatsby serve",
"deploy": "gatsby build && gh-pages -b master -d public"
},
"dependencies": {
"gatsby": "^2.0.0",
"gatsby-source-filesystem": "^2.0.1",
"gatsby-transformer-remark": "^2.1.3",
"react": "^16.5.1",
"react-dom": "^16.5.1"
},
"devDependencies": {
"gh-pages": "^2.0.0"
}
}
Plus, I'm trying to make an user/organization site like:
https://username/github.io
I'm just guessing email is not set in your git config. Try to run git config user.email to see if it's there.
You can follow this article on how to add it https://help.github.com/articles/setting-your-commit-email-address-in-git/.
Also, here are docs on how to set a github page.

Gatsby Deployment to Github Failing

Struggling with this one. I've downloaded and installed locally, this Gatsby starter pack:
https://github.com/ChangoMan/gatsby-starter-dimension .
And i'm trying to deploy to my github web page:
https://reenaverma.github.io/
I've followed the instructions, but keep getting this error when I run npm run deploy:
> gatsby-starter-dimension#1.0.0 deploy /Users/reenaverma/development/gatsby-starter-dimension
> gatsby build && gh-pages -b master -d public
success delete html and css files from previous builds — 0.014 s
success open and validate gatsby-config — 0.004 s
info One or more of your plugins have changed since the last time you ran Gatsby. As
a precaution, we're deleting your site's cache to ensure there's not any stale
data
success copy gatsby files — 0.014 s
success onPreBootstrap — 0.858 s
success source and transform nodes — 0.111 s
success building schema — 0.239 s
success createLayouts — 0.006 s
success createPages — 0.019 s
success createPagesStatefully — 0.005 s
success onPreExtractQueries — 0.004 s
success update schema — 0.102 s
success extract queries from components — 0.070 s
success run graphql queries — 0.098 s
success write out page data — 0.004 s
success write out redirect data — 0.001 s
success onPostBootstrap — 0.001 s
info bootstrap finished - 4.183 s
success Building CSS — 2.647 s
success Building production JavaScript bundles — 4.936 s
success Building static HTML for pages — 1.787 s
info Done building in 13.557 sec
sh: gh-pages: command not found
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! gatsby-starter-dimension#1.0.0 deploy: `gatsby build && gh-pages -b master -d public`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the gatsby-starter-dimension#1.0.0 deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/reenaverma/.npm/_logs/2018-05-30T17_41_52_319Z-debug.log
Here's my package.json:
{
"name": "gatsby-starter-dimension",
"description": "Gatsby Starter - Dimension by HTML5 UP",
"version": "1.0.0",
"author": "Hunter Chang",
"dependencies": {
"gatsby": "^1.9.235",
"gatsby-link": "^1.6.39",
"gatsby-image": "^1.0.42",
"gatsby-plugin-google-analytics": "^1.0.24",
"gatsby-plugin-react-helmet": "^1.0.8",
"gatsby-plugin-sass": "^1.0.23",
"gatsby-plugin-sharp": "^1.6.41",
"gatsby-remark-copy-linked-files": "^1.5.30",
"gatsby-remark-images": "^1.5.56",
"gatsby-source-filesystem": "^1.5.27",
"gatsby-transformer-remark": "^1.7.37",
"gatsby-transformer-sharp": "^1.6.22",
"lodash": "^4.17.4"
},
"homepage": "https://github.com/ChangoMan/gatsby-starter-dimension",
"keywords": [
"gatsby"
],
"license": "MIT",
"main": "n/a",
"repository": {
"type": "git",
"url": "https://github.com/ChangoMan/gatsby-starter-dimension.git"
},
"scripts": {
"dev": "gatsby develop",
"lint": "./node_modules/.bin/eslint --ext .js,.jsx --ignore-pattern public .",
"test": "echo \"Error: no test specified\" && exit 1",
"develop": "gatsby develop",
"build": "gatsby build",
"deploy": "gatsby build && gh-pages -b master -d public",
"fix-semi": "eslint --quiet --ignore-pattern node_modules --ignore-pattern public --parser babel-eslint --no-eslintrc --rule '{\"semi\": [2, \"never\"], \"no-extra-semi\": [2]}' --fix gatsby-node.js"
},
"devDependencies": {
"gh-pages": "^1.1.0",
"prettier": "^1.12.0"
}
}
And gatsby-config.sj:
module.exports = {
siteMetadata: {
title: "Gatsby Starter - Dimension by HTML5 UP",
author: "Hunter Chang",
description: "A Gatsby.js Starter based on Dimension by HTML5 UP"
},
pathPrefix: '/',
plugins: [
{
resolve: `gatsby-source-filesystem`,
options: {
path: `${__dirname}/src/posts`,
name: "posts",
},
},
{
resolve: `gatsby-source-filesystem`,
options: {
name: `images`,
path: `${__dirname}/src/images`,
},
},
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-images`,
options: {
maxWidth: 630,
},
},
"gatsby-remark-copy-linked-files",
],
},
},
`gatsby-transformer-sharp`,
`gatsby-plugin-sharp`,
`gatsby-plugin-react-helmet`,
`gatsby-plugin-sass`
],
}
got it working! I didnt install this:
npm install gh-pages --save-dev

Resources