I'm attempting use react-router in my brunch/babel setup. In my app.js I have:
import React from "react"
import ReactDOM from "react-dom"
import { Router, Route, Link } from "react-router"
This however gives me:
Uncaught Error: Cannot find module "history/lib/createHashHistory" from "react-router/Router"
When looking at the referenced line I see:
var _historyLibCreateHashHistory = require('history/lib/createHashHistory');
When inspecting the app.js that's generated via brunch I see:
require.register('history/createBrowserHistory', function(exports,req,module) {
...
});
How do I go about fixing this so that createBrowserHistory gets imported properly?
The module history is listed as a peer dependency by react-router, which means that you need to install it yourself through the command npm install history --save.
Related
I try to get a local debug token according to the instructions, but I don't see any in the console. I implemented this code as given. Is it maybe because the release and debug app-check don't work at the same time?
Guide: https://firebase.google.com/docs/app-check/android/debug-provider?hl=en#java_1, Point 3 doesn't work for me
MainActivity.java
import com.google.firebase.FirebaseApp;
import com.google.firebase.appcheck.FirebaseAppCheck;
import com.google.firebase.appcheck.playintegrity.PlayIntegrityAppCheckProviderFactory;
import com.google.firebase.appcheck.debug.DebugAppCheckProviderFactory;
FirebaseApp.initializeApp(/*context=*/ this);
FirebaseAppCheck firebaseAppCheck = FirebaseAppCheck.getInstance();
firebaseAppCheck.installAppCheckProviderFactory(PlayIntegrityAppCheckProviderFactory.getInstance());
firebaseAppCheck.installAppCheckProviderFactory(DebugAppCheckProviderFactory.getInstance());
build.gradle
implementation 'com.google.firebase:firebase-appcheck-debug:16.1.1'
is there maybe another way to get the local debug token so i can add it in the firebase console?
I'm trying to setup Agora for live streaming in my nuxtjs app. But it gives an error saying plugin not recognized in the console and I can't seem to get past this issue. Did anyone encounter similar issues? My nuxt version is "nuxt": "^2.15.8" and agora "agora-rtc-sdk-ng": "^4.13.0". The error I'm encountering now is:
I've imported the plugin in agora.js file in my plugins folder.
import Vue from "vue";
import { AgoraRTC } from 'agora-rtc-sdk-ng';
Vue.use(AgoraRTC);
And the nuxt config.
{
src: "~/plugins/agora.js",
ssr: false,
mode: 'client'
}
EDIT:
If I update the agora.js file with this code:
import Vue from "vue";
import AgoraRTC from 'agora-rtc-sdk-ng';
Vue.use(AgoraRTC);
I get the error: ReferenceError: AgoraRTC is not defined.
Am I missing something? Also it would be a great help if anyone could give reference to a demo build with nuxt.
After finding no solution to this, I contacted the support team of Agora. They had been a great help!
The problem was with Vue.use(AgoraRTC). For some reason this wasn't working. So I had to inject it in the app.
First I replaced these sections form plugins/agora.js file:
import Vue from "vue";
import AgoraRTC from 'agora-rtc-sdk-ng';
Vue.use(AgoraRTC);
and nuxt.config.js file:
{
src: "~/plugins/agora.js",
ssr: false,
mode: 'client'
}
With this:
import AgoraRTC from "agora-rtc-sdk-ng"
export default ({app}, inject) => {
inject("AgoraRTC", AgoraRTC)
}
and:
{
src: "~/plugins/agora.js",
mode: 'client'
}
Finally the AgoraRTC variable is accessible in the components as this.$AgoraRTC.
Reference to inject in $root from Nuxt docs
Thanks to the support team of Agora
I am looking for some best practices for publishing and developing nuxt plugins. I would like to write a plugin which gives our web applications the possibility to request oauth tokens from everywhere. I have written this plugin localy in my project and it works. Now my target is to move the code to a seperate plugin project and upload it to npm so every one in my company might use it easily. Are there any guides how to setup a nuxt plugin project? I found several guides for creating vue-plugins but the structure of them are a bit different to nuxt. I do not have a install method. Because my plugin simply wraps vuex store methods defined in oAuthStore.js as global methods, which can be used when I register my plugin in nuxt.config.js.
Vue plugins seems to work a bit different.
I upload a vue-plugin with an install method. When I try to import it and run my application on dev server (npm run dev) i always get the error message:
This dependency was not found: * my-plugin in ./plugins/vuex-persisted.js friendly-errors 16:55:24
friendly-errors 16:55:24
To install it, you can run: npm install --save my-plugin
My plugin has been uploaded to npm correctly and I have used it by executing npm install --save my-plugin so it has an entry on dependency list in package.json.
When I try to npm-link my-plugin I get the same error. This is the only way I know for rapid prototyping because I do not want a npm publish every time I want to test something. Does everyone know a way for a better developing workflow for working on nuxt plugins?
Thanks for any help.
Best regards
Moritz
/** oAuthPlugin.js **/
import oAuthStore from './oAuthStore.js'
import Cookies from 'js-cookie'
import createPersistedState from 'vuex-persistedstate'
export default ({store, isHMR, app}, inject) => {
app.store.registerModule('oAuth', oAuthStore );
var me = app;
inject('getOAuthCredentials', () => {
var data = {};
if(app.$store) {
var data = app.$store.getters["oAuth/getAuthCredentials"];
}
return data;
});
inject('requestOAuthCredentials', (data) => {
if(me.store) {
me.store.commit("oAuth/requestOAuthCredentials", data);
}
});
if (isHMR) return
// add persisted state as a vue mounted mixin
if (!app.mixins) {
app.mixins = []
}
app.mixins.push({mounted () {
createPersistedState({
key: 'vuex-persisted',
paths: ['oAuth'],
storage: {
getItem: key => Cookies.get(key),
setItem: (key, value) => Cookies.set(key, value, {expires: 3}),
removeItem: key => Cookies.remove(key)
}
})(store);
}});
}
/** nuxt.config.js **/
/*
** Plugins to load before mounting the App
*/
plugins: [
{ src: '~/plugins/vuex-persisted', ssr: false },
{ src: '~/plugins/oAuthPlugin.js' }
],
I have a simple akka Http Server:
import akka.http.scaladsl.model.{ContentTypes, HttpEntity}
import akka.http.scaladsl.server.HttpApp
import akka.http.scaladsl.server.Directives._
import akka.http.scaladsl.settings.ServerSettings
import com.typesafe.config.ConfigFactory
object MinimalHttpServer extends HttpApp {
def route =
pathPrefix("v1") {
path("subscribe" / Segment) { id =>
get {
complete(HttpEntity(ContentTypes.`text/html(UTF-8)`, s"<h1>Hello $id from Akka Http!</h1>"))
} ~
post {
entity(as[String]) { entity =>
complete(HttpEntity(ContentTypes.`text/html(UTF-8)`, s"<b>Thanks $id for posting your message <i>$entity</i></b>"))
}
}
}
}
}
object MinimalHttpServerApplication extends App {
MinimalHttpServer.startServer("localhost", 8088, ServerSettings(ConfigFactory.load))
}
I use Sbt native Packager to build an universal zip. When I deploy my application to Aws Elastic Beanstalk, I receive this error:
[Instance: i-0a846978718d54d76] Command failed on instance. Return code: 1 Output: (TRUNCATED)...xml_2.11-1.0.5.jar Unable to launch application as the source bundle does not contain either a file named application.jar or a Procfile. Unable to launch application as the source bundle does not contain either a file named application.jar or a Procfile. Hook /opt/elasticbeanstalk/hooks/appdeploy/pre/01_configure_application.sh failed. For more detail, check /var/log/eb-activity.log using console or EB CLI.
Any Ideas? Thank You!
It appears AWS Elastic Beanstalk expects your .zip to contain either a file named application.jar or a Procfile, and the zip created by sbt-native-packager does not look like that.
It appears sbt-native-packager does not have support for the format Elastic Beanstalk expects, though GitHub issue 632 shows some work done in that direction.
I've been trying to code an Angular2 component with web workers, but I'm having trouble importing code for the worker thread. Here's the start of my component's code:
import {Component} from 'angular2/web_worker/worker';
import {platform} from "angular2/core";
import {WORKER_APP_PLATFORM, WORKER_APP_APPLICATION} from 'angular2/platform/worker_app';
In loader.js, I call importScripts in the following way:
importScripts( "https://code.angularjs.org/tools/system.js",
"https://code.angularjs.org/2.0.0-beta.0/web_worker/worker.dev.js",
"https://code.angularjs.org/2.0.0-beta.0/angular2.min.js",
"../../../../node_modules/reflect-metadata/Reflect.js");
I've verified that loader.js executes, but when I run the application, I get errors stating that "angular2/web_worker/worker", "angular2/core", and "angular2/platform/worker_app" can't be found. Do I need to import different dependencies in loader.js?