Angular 9 - ERROR in In Ivy, decorator metadata must be inline - decorator

Angular 9 and ivy have only recently been published. But the migration is giving me a headache right now. Unfortunately the listed error is nowhere to be found and is not very meaningful.
I ask for help!
compilation error

I had same problem and it was fixed by replacing
#Injectable(({ providedIn: 'root' }))
with
#Injectable({ providedIn: 'root' })
Main idea is that decorator should accept object !

Related

import { createApp } from 'vue' randomly starts throwing error

I was working on my vue3 project without any errors occuring, when all of a sudden after setting up vue-routing this line:
import { createApp } from 'vue'
starts throwing this error:
Uncaught TypeError: Failed to resolve module specifier "vue". Relative
references must start with either "/", "./", or "../".
Before it worked just fine and the error did not appear immediately after setting up the routing.
Also for some reason an image can not be found anymore, even though it is still in the same location as before.
"GET http://127.0.0.1:5500/icon.svg 404 (Not Found)"
Vue + Vite project, set up via yarn.
Looked up the issue, but no other thread worked for me.

Next.js with Yarn pnp in a mono repo keep failing when trying to build

I am running Next.js 13.0.5 with Yarn 3.2.1 and Lerna 5.6.1.
It seems like the main problem here is the build tool, because when I run the Next.js server itself (yarn dev) everything works perfectly.
What error am I getting?
Type error: Cannot find module 'next/app' or its corresponding type declarations.
which happens here right at the start of the program
import type { AppProps } from 'next/app'
^
function MyApp({ Component, pageProps }: AppProps) {
return <Component {...pageProps} />
}
After looking around I tried some experimental features like swcFileReading : false
but it doesn't seem to have any effect.
try:
yarn dlx #yarnpkg/sdks vscode
Then you don't need to fallback to nodeLinker: node-modules as other StackOverflow suggestions to this problem. It resolved for me!
for more info check the yarn/ts issue: https://github.com/yarnpkg/berry/issues/4872#issuecomment-1284318301

web3uikit Module not found error even when module is installed

When trying to import web3uikit, the next application throws an error Module not found. I tried uninstalling and installing the package again, but it's not working. My package.json also has the dependency, but the error still exists.
I don't know why this is happening, I even tried restarting the development server, but nothing changed. Can anyone please help me understand why this error is happening and how I can resolve it?
import {ConnectButton} from 'web3uikit'
import React from 'react'
const Sidebar = () => {
return (
<div>
<ConnectButton />
</div>
)
}
export default Sidebar
was encountering the same error, turns out i have to install this very specific version "^0.1.159"
use :
npm i web3uikit#^0.1.159

Cannot find module or type declarations while it works in local build

I keep getting this error when trying to build my app on Vercel, while it works locally without problems.
Here is the error message
Cannot find module Type error: Cannot find module './sidenav/SideNav' or its corresponding type declarations.
At this line
import SideNav from "./sidenav/SideNav"
While import this works fine in the same component
import NavigationBar from "./navigationBar/NavigationBar"
My SideNav is nothing special
const SideNav = () => {
return (
<>
<div></div>
</>
);
};
export default SideNav;
Any idea on what the problem could be?
I was facing this issue too. After initial commit, I renamed a folder from ./src/Provider to ./src/provider making my Github builds fail. Clearing my git cache and re-committing somehow fixed the problem.
git rm --cached -r .
After some testing, changing the folder to ./sideNav/SideNav instead of ./sidenav/SideNav works even if the initial import naming was correct in the name
The error maybe also because of the OS you are using.
E.g, if using mac, folder and file names are case-insensitive, so if you are not using the same case as the file, it will work fine locally, but when you deploy it to vercel, case causes the problem.

Global CSS does not work when building Next.js with Bazel

I build my Next.js app with Bazel.
It works fine, but there is one problem:
When I import styles/globals.css into pages/_app.tsx, Next.js throws this error:
Global CSS cannot be imported from files other than your Custom <App>. Please move all global CSS imports to pages/_app.js. Or convert the import to Component-Level CSS (CSS Modules).
Read more: https://err.sh/next.js/css-global
Location: pages/_app.tsx
Which obviously doesn't make sense.
Reproduction
yarn install
yarn start:bazel (http://localhost:3000, works just fine)
Now uncomment this line
yarn start:bazel (Error while buildling)
Edit 1
After a suggestion by Ulrich Thomas Gabor, it turns out that ctx.customAppFile is null, which might be the root of the problem.
Here is a log output of ctx when building with Bazel:
{
ctx: {
rootDirectory: '/home/flo/.cache/bazel/_bazel_flo/e959037946bf226f3b911fa40ec62d93/sandbox/linux-sandbox/85/execroot/nextjs-bazel/bazel-out/k8-fastbuild/bin',
customAppFile: null,
// ...
}
}
Edit 2
After some more debugging, I found the problem:
This if statement fails because of this error
Error: EACCES: permission denied, access '/home/flo/.cache/bazel/_bazel_flo/e959037946bf226f3b911fa40ec62d93/sandbox/linux-sandbox/186/execroot/nextjs-bazel/bazel-out/k8-fastbuild/bin/pages/_app.tsx'
If I patch Next.js to ignore this error, everything works fine!
But how to prevent the EACCES error?

Resources