I use TypeScript 1.8 and have the following file structure:
src
reducers
index.ts
someReducer.ts
app.tsx
reducers/index.ts
import { combineReducers } from "redux";
import someReducer from "./someReducer";
const appReducer = combineReducers({
someReducer
});
export default appReducer;
In app.tsx I am trying to import it like this:
import appReducer from "./reducers";
However, I get an error:
Cannot file module './reducers'
I checked the Modules Resolution article, which says that TypeScript will look into index.ts in the folder, but apparently it does not?
index.ts will only be discovered and used if you are using --moduleResolution node, and it will only work at runtime if you are in Node.js or using a module loader that implements the same semantics as Node.js. (In other words, you are really better off explicitly specifying the file, instead of relying on Node.js-specific semantics.)
Related
I'm new to use Bootstrap-vue, since I use CDN reference to use it, it work abd perfect for me. Now I try to change webpack version, I face on some issue.
This is CDN version of bvModal.msgBoxOk method
this is webpack version of bvModal.msgBoxOk method
you can see the different in top of "X" button, I don't know which step I missing. The following is my main.ts file
// Import Bootstrap an BootstrapVue CSS files (order is important)
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import Vue from 'vue';
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
// Make BootstrapVue available throughout your project
Vue.use(BootstrapVue);
// Optionally install the BootstrapVue icon components plugin
Vue.use(IconsPlugin);
Any body can help me?
The following error message is given:
"Argument of type 'typeof VueAnalytics' is not assignable to parameter of type 'Plugin_2'.
Type 'typeof VueAnalytics' is not assignable to type '{ install: PluginInstallFunction; }'.
Types of property 'install' are incompatible."
What am I doing wrong ? Thank you very much for your help.
import { createApp } from "vue";
import App from "./App.vue";
import "./registerServiceWorker";
import router from "./router";
import store from "./store";
import VueAnalytics from "vue-analytics";
createApp(App)
.use(store)
.use(VueAnalytics, {id:'', router})
.mount("#app");
This error indicates that the plugin was built for Vue 2 and is not compatible with Vue 3. Checking the package's npm page reveals that there have been no updates in the last year. The requirement also lists Vue 2.
The last Github commit was in January.
Following some links from the package's Github leads to this package which looks like it may work with Vue 3.
I am teaching myself some Vue.js and after finding out about view-router I have to restructure my project.
How can I use my import (bulma, fontawesome, bulma-calendar...) in every view/component and import it only once?
I'd appreciate a hint. Thanks
In case if you want to use styles file globally you can import it inside your App.vue in style section.
<style lang="scss">
//your imports here
</style
If you want to import js files globally you can do it in your main.js file
In vue2 vue plugins are connected in this way:
import Vue from "vue";
import PluginName from "pulin-name";
Vue.use(PluginName);
For vue3 use:
import { createApp } from "vue";
import PluginName from "plugin-name";
const app = createApp(...);
app.use(PluginName);
Correct way should be described in plugin documentation, so read it before start to use in your project.
i want add a vue panel in my project : vue-black-dashboard
in documentation :
Vue Black Dashboard is built as Vue plugin so you can simply import it
and use it.
import Vue from 'vue';
import DashboardPlugin from '#/plugins/blackDashboard'
Vue.use(DashboardPlugin);
but i dont know where paste vue-black-dashboard folder
how i can import it to my project
thanks
If you want to import it and use in a local component, just import it in component.
<script>
import Vue from 'vue';
import DashboardPlugin from '#/plugins/blackDashboard'
Vue.use(DashboardPlugin);
export default {
}
</script>
If you want to import it and use globally, just import it in main.js.
import Vue from 'vue';
import DashboardPlugin from '#/plugins/blackDashboard'
Vue.use(DashboardPlugin);
hello thanks for your answer
import DashboardPlugin from '#/plugins/blackDashboard'
where is the # in this address ?
i want use this template in specify route of my project
when i import it in main.js
This dependency was not found:
#/plugins/blackDashboard in ./src/main.js
To install it, you can run: npm install --save
#/plugins/blackDashboard
How's your plugin file look like? I have a similar issue with having plugins in separate files in /plugins directory and importing them to main.js
What I'm trying to achieve is better structure of plugins to keep them in separate files in folder plugins, rather than storing all the code in main.js
Not sure is it allowed or is it a good practice.
Plugins folder: plugins/toastification.js
import Vue from 'vue'
import Toast from 'vue-toastification'
import 'vue-toastification/dist/index.css'
const options = {
position: 'bottom-right'
}
Vue.use(Toast, options)
// export default new Toast() - got error while exporting but it works somehow without export default I don't know why
Part of main.js
// plugins
import vuetify from './plugins/vuetify'
import i18n from './plugins/i18n'
import toastification from './plugins/toastification'
import logger from './plugins/logger'
new Vue({
vuetify,
i18n,
toastification,
logger,
render: h => h(App)
}).$mount('#app')
There's the library I load with npm: #ckeditor/ckeditor5-build-classic. It works. I can use by
import ClassicEditor from '#ckeditor/ckeditor5-build-classic'
After that I pull the target file (it's specified in package.json as ./build/ckeditor.js) and put it outside of node_modules to the project's root.
I try to use it by
import ClassicEditor from './ckeditor'
But it does not work. The error is
"export 'default' (imported as 'ClassicEditor') was not found in 'ckeditor'
Why so? There's no export default construction indeed, but it works somehow from node_modules. How to make it work outside of node_modules?
To make CKEditor work in the <script type="module"> element, type:
import {} from './ckeditor.js'
or, simply:
import './ckeditor.js'