When using Turborepo's wildcard imports (snippet from package.json)
dependencies: {
"branding": "*"
}
inside of a React app created with create-react-app, I get the error:
ERROR in ./src/App.js 5:0-37
Module not found: Error: Can't resolve 'branding' in 'C:\Users\****\Projects\Development\monorepo\apps\share\src'
I think I'm doing something very wrong, but I can't work it out through Turborepo's documentation.
Related
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?
I am using "vue": "^3.0.0" and trying to use some Reactivity in Depth from vue. But got error
Module '"vue"' has no exported member 'reactive'
Module '"vue"' has no exported member 'ref'
Even document here: https://v3.vuejs.org/guide/reactivity.html#what-is-reactivity
More detail packages
"vue-class-component": "^8.0.0-0",
"vue-property-decorator": "^9.1.2",
...
"#vue/compiler-sfc": "^3.0.0",
One of your dependencies is not compatible with Vue 3 - requiring Vue 2. So you have installed both versions.
You can try execute npm explain vue to find out which one is it...
For whoever comes across this question, is using pnpm and running into this issue with all Vue exports, like:
Problems:
TS2305: Module '"vue"' has no exported member 'defineComponent'.
TS2305: Module '"vue"' has no exported member 'Component'.
TS2305: Module '"vue"' has no exported member 'Ref'.
TS2305: Module '"vue"' has no exported member 'ref'.
I noticed I had "preserveSymlinks": true in my tsconfig.json, removing it (or setting it to false) cleared the errors.
// tsconfig.json
{
// ...
"compilerOptions": {
// ...
"preserveSymlinks": false // no more errors ✅
}
}
I've got an error like so:
error: Cannot resolve module "<path>/src/routes" from "<path>/src/index.ts"
Imported from "file:///F:/Development/k8demo/api-deno/src/index.ts:2"
My problem was that Deno requires a .ts extension for imports unlike node.
Fix by adding .ts to the import.
I am trying to use the wonderful Quokka package by WallabyJS https://github.com/wallabyjs/atom-quokka.
I am trying to import an ES6 module but keep getting an error in the Quokka console:
Unexpected token import at createScript vm.js:56
I have tried updating my package.json file and set babel: true as advised in the configuration page here but i still get the error.
Link to my package.json file here
You need to specify react-app preset in your Quokka config, so instead of "babel: true", you need:
babel: {
presets: ['react-app']
}
Decorators in my project do not work. I include this as first line import 'babel-core/polyfill' but still have an error
Module build failed: SyntaxError: .../index.js: Unexpected token
If you really need babel5 instead of babel6 here is documentation for the former
https://github.com/babel/babel.github.io/blob/5.0.0/docs/usage/experimental.md
you can have .babelrc in your project root with content:
{
"optional": ["es7.decorators"],
}