I'm trying to migrate from vue-cli to Vite using Vue 2.0.
I've some JavaScript-generated files for GRPC communication; alongside each file, there is a declarative file because I'm using Vue with TypeScript. When running Vite, I get this error:
Uncaught SyntaxError: The requested module '/src/proto/admin_config_grpc_web_pb.js' does not provide an export named 'AdminConfigurationServicePromiseClient'
However, I've a corresponding declaration file which contains this line:
export class AdminConfigurationServiceClient {
Anybody has encountered this issue and has a solution?
Thanks
This error is similar to the vite issue https://github.com/vitejs/vite/issues/2117.
Do not re-export typescript type or interface in vite. You can just export it in file A and import it in file B. Don't try to export it in file B again
BTW,
https://github.com/originjs/webpack-to-vite
This is a github project that I found when I searched for error messages when I was converting an old project. It lists some conversion items and error repair methods. It can even convert an old project to a vite project with one click. It’s great, I recommend it!
A workaround can be if you declare a new interface that inherits from the one that you want to re-export.
a.vue
export interface AItem extends ItemModel {}
b.vue
export interface A2Item extends ItemModel {}
Related
I am trying to setup ACRA for my react native project which using 0.61.2 version. I followed the basic setup tutorial from https://github.com/ACRA/acra/wiki/BasicSetup .
But while building the project I got errors
/android/app/src/main/java/com/agentnativeapp/MainApplication.java:36: error: cannot find symbol
CoreConfigurationBuilder builder = new CoreConfigurationBuilder(this)
^
symbol: class CoreConfigurationBuilder
location: class MainApplication
I don't understand what am I missing. I thought I might be missing the jar file, but there are no instructions showing the requirement of jar file.
I am new to JAVA side of programming so I am new to all these jar stuff
Turns out it was all importing problem.
import org.acra.;
import org.acra.annotation.;
The above statement doesn't actually import every class, so I have to CoreConfigurationBuilder separately
import org.acra.config.CoreConfigurationBuilder;
I have to create an package of vue component and then install it in another project.
My code sample is given here. After using npm run build command I got a converted js file.
I install it in another project. And in my project in main.js, I am using below line to add this dependency.
import 'test'
but in my browser I am getting this error.
[Vue warn]: Unknown custom element: - did you register the
component correctly? For recursive components, make sure to provide
the "name" option.
(found in )
I dont understand what I am missing for adding funnel component to my project.
You need to also declare in the components option.
import test from 'test
export default {
components: {
test
}
}
Running Jest throws this error for a simple test file:
Must export a default export when using ES6 modules.
at createDescriptor (node_modules/#babel/core/lib/config/config-descriptors.js:170:13)
at items.map (node_modules/#babel/core/lib/config/config-descriptors.js:110:50)
at Array.map (<anonymous>)
at createDescriptors (node_modules/#babel/core/lib/config/config-descriptors.js:110:29)
at createPresetDescriptors (node_modules/#babel/core/lib/config/config-descriptors.js:102:10)
at presets (node_modules/#babel/core/lib/config/config-descriptors.js:48:19)
at mergeChainOpts (node_modules/#babel/core/lib/config/config-chain.js:320:26)
at node_modules/#babel/core/lib/config/config-chain.js:283:7
at buildRootChain (node_modules/#babel/core/lib/config/config-chain.js:90:20)
at loadPrivatePartialConfig (node_modules/#babel/core/lib/config/partial.js:85:55)
The problem is boiled down to #babel/core dependency because when I remove it, it throws Cannot find module 'babel-core' but after I include it, it starts complaining about a required default export.
Is there a way to disable this rule? How can I find the offending file and just maybe add an export default {} there? Anyone else with this problem?
I've successfully used the material-components-web library from within my aurelia skeleton-esnext-webpack projects but I am strugling to get them working in a skeleton-esnext project.
The problem seems to be with the fact that the skeleton-esnext project uses jspm with system.js as its module loader.
I have added "#material/textfield": "npm:#material/textfield#^0.3.6" to the jspm dependencies section of my package.json which seems to install the correct #material libraries to my jspm_modules/npm/#material.
Now, when I try to access any class from this library from within any my aurelia view models
import {MDCTextfieldFoundation} from '#material/textfield';
I get the following error in the browser when I run the project:
Error: (SystemJS) Unexpected token import
SyntaxError: Unexpected token import
at eval (<anonymous>)
at Object.eval (http://localhost:9000/jspm_packages/npm/#material/textfield#0.3.6.js:1:123)
at eval (....
Any suggestions to whats most likely causing this issue?
SystemJS is importing the raw source file of the plugin instead of the transpiled one (you can see this if you look into jspm_packages/npm/#material/textfield#0.3.6.js.
You can fix it by changing the location in there to point to the dist directory of the directory textfield#0.3.6. However, it gets overriden all the time on potential updates. And it is not saved in CVS.
Another, more simpler approach, would be to import the correct file in your view model:
import {MDCTextfieldFoundation} from '#material/textfield/dist/mdc.textfield';
I'm playing around with ES6 syntax and would like to build a small module in NPM, which uses another npm module (e.g. push-js) as a dependency. Currently, I'm using rollup to bundle and generate my distribution files.
I'm not sure what's the right way to include a dependency in order to use it in my own module. This is what I tried
import * as Push from 'push.js';
class _MyModule
{
Push.create("Go ahead, click this notification", {
});
}
Rollup triggers the following error on this code:
events.js:160
throw er; // Unhandled 'error' event
^
Error: Unexpected token
Am I doing something fundamentally wrong here?
You are close enough. However, at least in current transpilers (Babel and co.), CommonJS module exports are treated like default exports. Meaning, instead of importing all separate entities (import * as Push), you only have to import the default exports (import Push).
import Push from 'push.js';
class _MyModule
{
constructor() {
Push.create("Go ahead, click this notification", {
});
}
}
How the actual interoperability between CommonJS and ES Modules will be solved, is not yet finalized. See Axel Rauschmayr's blog post on the subject.