What is the import statement for cordova-plugin-sqlite-2 in Ionic framework? - ionic-framework

I am trying to use cordova-plugin-sqlite-2 plugin in my Ionic app, but I'm not sure how to use its features for opening or creating a database .
What import () statement should I give to use this plugin ?
I have referred this Question in which 'import { SQLite } from 'ionic-native';
is used , but it is showing error when used.

I'm not sure if you're trying to use sqlite only or some other DB, but I have recently used PouchDB inside my Ionic5+ReactJs+Typescript app, and here is what I did:
Install the necessary packages
npm install pouchdb pouchdb-adapter-cordova-sqlite cordova-plugin-sqlite-2
#types/pouchdb #ionic-native/sqlite
Please note that #types packages are for typescript support.
Create a sample database
import PouchDB from "pouchdb";
import "cordova-plugin-sqlite-2/dist/sqlite-plugin";
import cordovaSqlitePlugin from "pouchdb-adapter-cordova-sqlite";
PouchDB.plugin(cordovaSqlitePlugin);
let sampleDB = new PouchDB("sampleDatabase", {
adapter: "cordova-sqlite",
});
After that you can use the database object directly
sampleDB.post({name: "my first object"});

Related

PostgreSQL react-native setup

I'm having issues getting PostgreSQL to run on my local machine with react-native. I work primarily as a database developer so it's possible I'm missing something, but in my opinion this is something that should be well documented.
I run the following commands to create a react native project (npm v 4.6.1)
npm install -g expo cli
expo init needhelp
cd needhelp
then I paste in my app.js file and it runs fine. This is my app.js file.
import React, { Component } from 'react';
import { Text, View, Image } from 'react-native';
//const { Client } = require('pg')
//const { Pool, Client } = require('pg')
export default class HelloWorldApp extends Component {
render() {
return (
<View style = {{flex: 1, flexDirection: 'column', alignItems: 'center',}}>
<Text>Hello World!</Text>
</View>
);
}
}
The problem is, when I try and include pg in any way I get errors. The first error I get is "unable to resolve module pg." Then after I run npm install pg, I get
[22:32:20] The package at "node_modules\pg\lib\index.js" attempted to import the Node standard library module "util". It failed because React Native does not include the Node standard library. Read more at https://docs.expo.io/versions/latest/introduction/faq.html#can-i-use-nodejs-packages-with-expo
[22:32:20] Failed building JavaScript bundle.
Then after installing this I get:
[22:34:03] The package at "node_modules\pg\lib\connection.js" attempted to import the Node standard library module "net". It failed because React Native does not include the Node standard library. Read more at https://docs.expo.io/versions/latest/introduction/faq.html#can-i-use-nodejs-packages-with-expo
[22:34:03] Failed building JavaScript bundle.
Building JavaScript bundle [===================================================================================== ] 9>
Then
[2:36:57] The package at "node_modules\pg\lib\client.js" attempted to import the Node standard library module "events". It failed because React Native does not include the Node standard library. Read more at https://docs.expo.io/versions/latest/introduction/faq.html#can-i-use-nodejs-packages-with-expo
[22:36:57] Failed building JavaScript bundle.
then
[00:38:48] The package at "node_modules\pg\lib\connection.js" attempted to import the Node standard library module "tls". It failed because React Native does not include the Node standard library. Read more at https://docs.expo.io/versions/latest/introduction/faq.html#can-i-use-nodejs-packages-with-expo
[22:38:48] Failed building JavaScript bundle.
Then finally, the error that dooms me:
metro bundler has encountered an internal error, please check your terminal error output for more details.

SyntaxError: export declarations may only appear at top level of a module when trying to import office-ui-fabric in a Gatsbyjs blog

I'm trying to add OfficeUI fabric components in a blog build using gatsby js.
As soon as I'm importing any component, the site stop to works.
Using develop command, I can see in the browser console : SyntaxError: export declarations may only appear at top level of a module
How to fix this ? (I'm very new to node dev).
Searches I've done suggest problems with babel not using the es2015 preset. However, I double checked, the .babelrc file is mentioning this preset.
Here's the complete operations I've done (on Windows 10 x64 if it matters):
cloned the gatsby-starter-blog-no-styles repo :
gatsby.cmd new someblog https://github.com/noahg/gatsby-starter-blog-no-styles
cd someblog
npm install
drink a coffee (will move to yarn soon)
Check that works
gatsby develop
Opened the browser (http://localhost:8000). Its Ok
added office ui fabric react components
npm install --save office-ui-fabric-react
Restart gatsby develop. Still working
change src/layouts/index.js file to import an office component
import React from 'react'
import Link from 'gatsby-link'
import { Button } from 'office-ui-fabric-react/lib/Button'
class Template extends React.Component {
....
And voilĂ ! it stop to works. In the browser console, I see an error : SyntaxError: export declarations may only appear at top level of a module
I put in GH a complete reproduction repository : https://github.com/stevebeauge/repro-gatsbyjs-officeui-error
[Edit] Digging a bit I can see in the generated 'common.js' file the error :
/***/ "./node_modules/office-ui-fabric-react/lib/Button.js":
/***/ (function(module, exports) {
export * from './components/Button/index';
//# sourceMappingURL=Button.js.map
/***/ }),
The export here seems to be forbidden, which leads to Babel issue (not found how to solve though)
Recently i stumbled upon the similar error, my solution was to explicitly import from lib-commonjs:
import { Button } from 'office-ui-fabric-react/lib-commonjs/Button';
instead of
import { Button } from 'office-ui-fabric-react/lib/Button'
Seems to be the error occurs since babel isn't converting office-ui-fabric-react to CommonJS module.

Import Leaflet.awesome-marker in angular/cli component

I want to use the Leaflet.awesome-marker plugin in my angular project.
I installed the package throught yarn and imported in my component using
import * as awesome from 'leaflet.awesome-marker';
But I receive the following error:
Cannot find module 'leaflet.awesome-marker'
Doing the same thing with the geojson module works fine, why not with this one?
Try importing leaflet.awesome-markers, not leaflet.awesome-marker

Why do I need to import collections in router file?

I'm building simple webs with meteor, just to get to know each other, and I'm playing with iron:router as router.
The "problem" I got is that in my meteorapp/lib/routes.js I need to import my collection file which is in meteorapp/imports/ui/reservations.js:
import { Reservations } from '../imports/api/reservations.js';
Otherwise I'm not able to reach it in the template, even though I imported it same line (different path) in the templage.js file like this:
import { Meteor } from 'meteor/meteor';
import { Template } from 'meteor/templating';
//collection Reservations
import { Reservations } from '../api/reservations.js';
import './roomSchedule.html';
Template.roomSchedule.onCreated(function roomScheduleOnCreated() {
Meteor.subscribe('reservations');
});
Template.roomSchedule.helpers({
allHours() {
return Reservations.find();
},
});
I don't know if this would help, meteor list output:
user#laptop:~/Documents/meteorApps/mymeteorApp$ meteor list
blaze-html-templates 1.1.2 Compile HTML templates into reactive UI with Meteor Blaze
ecmascript 0.10.3* Compiler plugin that supports ES2015+ in all .js files
es5-shim 4.7.3 Shims and polyfills to improve ECMAScript 5 support
insecure 1.0.7 (For prototyping only) Allow all database writes from the client
iron:router 1.1.2 Routing specifically designed for Meteor
meteor-base 1.3.0 Packages that every Meteor app needs
mobile-experience 1.0.5 Packages for a great mobile user experience
mongo 1.4.3 Adaptor for using MongoDB and Minimongo over DDP
reactive-var 1.0.11 Reactive variable
shell-server 0.3.1 Server-side component of the `meteor shell` command.
standard-minifier-css 1.4.1 Standard css minifier used with Meteor apps by default.
standard-minifier-js 2.3.2 Standard javascript minifiers used with Meteor apps by default.
tracker 1.1.3 Dependency tracker to allow reactive callbacks
So it works... but don't know why... Thanks in advance to everyone.
Axel.

Import Famo.us Ember-Cli project

I am trying to import famous into my application
When i create a breakpoint in the base index.html file in ember cli and look at what require seems to know about i see famo.us is there
in my brocfile i have tried the following
app.import('vendor/famous/famous.js', {
'famous/core/Context':''
});
app.import('vendor/famous/famous.js', {
'famous/core/Context':'default'
});
app.import('vendor/famous/famous.js');
this may be fixed by master of loader.js https://github.com/stefanpenner/loader.js/issues/25