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 ✅
}
}
Related
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.
I am attempting to set up a nuxt project with scss. I added the following packages to my project:
"sass": "^1.37.0",
"sass-loader": "10",
and I updated nuxt.config.js to say the following to point to my new scss main file:
// Global CSS: https://go.nuxtjs.dev/config-css
css: [
'~/assets/sass/main.scss'
],
I had to use older versions because i was getting errors with certain functions I was using but i managed to get it working correctly on my local machine, and it builds just fine repeatedly as I update code as well.
I am now trying to deploy to staging on a Linux/nginx server and I am getting the following errors when building npm run build:
ERROR in ./assets/sass/main.scss (./node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!./node_modules/postcss-loader/dist/cjs.js??ref--7-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--7-oneOf-1-3!./assets/sass/main.scss)
Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
SyntaxError
(1:1) postcss-custom-properties: <css input> Unknown word
> 1 | var(--font-size-2)/var(--font-ratio)
| ^
It looks like it's using css builder instead of sass builder! Does anyone know how to fix this? I doublechecked that the files on the server include the sass-loader and that the config is pointing to my .scss file, and i checked the documentation which states that Nuxt will automatically choose the correct loader.
What am I doing wrong?
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']
}
I'm trying to add this react component to my meteor project:
https://github.com/dancormier/react-native-swipeout
I added this with standard browserify/npmhacks process. When I run the app initial thereafter, I receive this error:
Marks-MacBook-Air:meteor-app markshust$ meteor --settings settings/dev.json
[[[[[ ~/Sites/meteor-app ]]]]]
=> Started proxy.
=> Started MongoDB.
npm-container: updating npm dependencies -- react-native-swipeout, externalify...
=> Errors prevented startup:
While processing files with cosmos:browserify (for target web.browser):
lib/app.browserify.js: Unexpected token (53:6) while parsing file:
/Users/markshust/Sites/meteor-app/packages/npm-container/.npm/package/node_modules/react-native-swipeout/index.js
While processing files with cosmos:browserify (for target os.osx.x86_64):
lib/app.browserify.js: Unexpected token (53:6) while parsing file:
/Users/markshust/Sites/meteor-app/packages/npm-container/.npm/package/node_modules/react-native-swipeout/index.js
=> Your application has errors. Waiting for file change.
When I pull up line 53 of https://github.com/dancormier/react-native-swipeout/blob/master/index.js, it's hitting some jsx. The file is named with a .js suffix, so it appears Meteor is having a problem when it runs into the jsx code.
I'm assuming this is a common problem when using react components from npm with meteor. How does one easily resolve this?
Many thanks!
Mark
packages.json
{
"react-native-swipeout": "2.0.8",
"externalify": "0.1.0"
}
lib/app.browserify.js
Swipeout = require('react-native-swipeout');
lib/app.browserify.options.json
{
"transforms": {
"externalify": {
"global": true,
"external": {
"react": "React.require"
}
}
}
}
react-native-swipeout peer dependencies react-native
so you need add react-native in packages.json or package.js add Npm.depends
meteor 1.3 still use node0.10, but react-native need node 0.12,so react-native-swipeout need waite meteor 1.4 for use
$MONGO_VERSION = "2.6.7"
$NODE_VERSION = "0.10.45"
$NPM_VERSION = "2.15.1"
$PYTHON_VERSION = "2.7.10"
So I've done the todo and leaderboard tutorials and now am excited to begin routing - seems like iron router is the way to go so I install it to my project using
mrt add iron-router
Seems to install ok so I start meteor and navigate to localhost:3000 and my console lights up with:
Uncaught TypeError: undefined is not a function
helpers.js:141 Uncaught TypeError: Cannot read property 'prototype' of undefined
router.js:61 Uncaught TypeError: undefined is not a function
global-imports.js?784bc180a149e4c10dff977a7f114df67d9952c6:3 Uncaught TypeError: Cannot read property 'RouteController' of undefined
template.tutorialexample.js?e119ff8df948cfe8167f49eb28794995a594841c:2 Uncaught ReferenceError: Template is not defined
tutorialexample.js?a4ef596255404350be2cc45303caea02f934cd17:1 Uncaught ReferenceError: Meteor is not defined
Mind you this is a default app, haven't touched a thing.
So if someone could point me in the right direction that would be great. I did read somewhere that I should be using 0.8.2 version of iron router - and I then did change my smart.json file to contain:
{
"packages": {
"iron-router": "0.8.2"
}
}
and then did meteor update etc but still no luck. So any help anyone could provide would be great.
Meteor has changed quite a bit & the instructions/tutorial you've been following is a bit dated.
Previously mrt was part of the meteorite packaging system, from Meteor 0.9.0 it has been integrated directly into meteor.
So now you do:
meteor add iron:router
To add it to your project. Once you start your app up it should present a basic template on how to use it.