Load relative (dev) node_modules import from non root folder - ecma

I use for dev http protocol and load script like module ->
<script defer type="module" src="App.js"></script>
For some reason for https i need to build it with browserify and esmify to make it work. [not important i already ask Q about this]
In that case i use load script like text/javascript
<script defer src="../../builds/slot.js"></script>
This all works fine if i have app.js in root folder.
Why i can't fix Uncaught TypeError: Failed to resolve module specifier "*******". Relative references must start with either "/", "./", or "../". when my App.js is not in root dir?
For example my import looks like:
import * as blabla from "./../../node_modules/blabla/index.js";

Related

Getting error when trying to use workbox local files instead of CDN

The situation is the following, I have been using workbox to precache files. It works locally, but when I upload my changes to an actual web page. I get the following error:
workbox-sw.js:1 Refused to load the script https://storage.googleapis.com/workbox-cdn/releases/6.0.2/workbox-routing.prod.js because it violates the following Content Security Policy directive: "default-src 'self' 'unsafe-inline' 'unsafe-eval' data: https://api.paguetodo.com https://static.paguetodo.com.
Note that 'script-src-elem' was not explicitly set, so 'default-src' is used as a fallback
So what I have been trying to do is using local Workbox files instead of CDN. When I perform the commands everything seems fine and the files are added to my project, but when I try to import them like this in my service worker file:
importScripts('workbox-v6.0.0/workbox-sw.js');
workbox.setConfig({
modulePathPrefix: 'workbox-v6.0.0/'
});
I get the following error in the browser:
Strategy.js:143 Uncaught (in promise) TypeError: this.q is not a function
at w.v (Strategy.js:143)

Generate ServiceWorker using workbox 6 - how to import "registerRoute" from "workbox-routing"?

I have upgraded my project to use workbox 6 and have modified my code accordingly.
After injecting manifest (generating serviceWorker.js) my browser reports error:
Service worker error TypeError: ServiceWorker script at
http://127.0.0.1:8080/serviceWorker.js for scope
http://127.0.0.1:8080/ threw an exception during script evaluation. app.js:218:23
I have removed code to determine what causes the error and am now left with:
serviceWorker.js (generated from serviceWroker-base.js)
importScripts('workbox-sw.js');
import { registerRoute } from 'workbox-routing';
import { StaleWhileRevalidate } from 'workbox-strategies';
const CACHE_DYNAMIC_NAME = 'dynamic-DEBUG-001'
webpack.config.js
const {InjectManifest} = require('workbox-webpack-plugin')
const workboxWebpackInjectPlugin = new InjectManifest({
swSrc: './serviceWorker.js'
})
// build WEBPACK CONFIG
const config = {}
//...
config.plugins = [
nodeEnvPlugin,
firebasePlugin,
cssExtractPlugin,
workboxWebpackInjectPlugin,
]
//...
return config
If I remove the imports of registerRoute and StaleWhileRevalidate in serviceWorker.js then the service worker registers successfully - but then I cannot register routes. ;) I have installed workbox-routing and workbox-strategies.
package.json
"scripts": {
"generate:sw": "workbox injectManifest"
},
"dependencies": {
...
"workbox-routing": "^6.0.2",
"workbox-strategies": "^6.0.2"
},
"devDependencies": {
...
"webpack": "^4.41.2"
}
generate:sw is the command I run to inject manifest and create serviceWorker.js.
My suspicion is that the imoprts are not handled correctly? How can I use registerRoute and StaleWhileRevalidate in my service worker?
Kind regards /K
The info at https://developers.google.com/web/tools/workbox/guides/using-bundlers might be helpful.
You don't need to include importScripts('workbox-sw.js');
If you plan on using precaching:
You can run InjectManifest via workbox-webpack-plugin and it will take care of both compiling your service worker (i.e. inlining the ES module imports into a final, runnable service worker file) as well as replacing a self.__WB_MANIFEST inside your service worker file with the actual precache manifest based on the assets in your webpack build.
If you don't plan on using precaching:
You can add your service worker file, including the ES module imports, as a entry point in your webpack config, and that should handle inlining the ES module imports into a final, runnable service worker file.
If you're already using webpack, then your workbox injectManifest step isn't needed. See the previous two points.

Adding Typescript to Vue + Rails app - Imports no longer work?

I'm trying to add TypeScript to an existing VueJS + Rails app. I cloned this demo (https://github.com/gbarillot/rails-vue-demo-app) then followed the instructions from https://github.com/rails/webpacker
$ bundle exec rails webpacker:install:vue
$ bundle exec rails webpacker:install:typescript
I then modified config/webpack/loaders/typescript.js as described here.
Everything seems to compile, but when I go into my "home" view and change the script to typescript:
<script lang="ts">
import Layout from '../shared/layout';
export default {
components: {
Layout
}
}
</script>
I get the following error:
Failed to compile.
/Users/matt/projects/rails-vue-demo-app/app/javascript/packs/components/home/index.vue.ts
[tsl] ERROR in /Users/matt/projects/rails-vue-demo-app/app/javascript/packs/components/home/index.vue.ts(13,20)
TS2307: Cannot find module '../shared/layout'.
Why can I no longer find the layout file when typescript is enabled?
I remember running into a similar problem for presentational components. Try adding an empty export in shared/layout so typescript can pick it up:
<script lang="ts">
export default {}
</script>

Play 2 bower webjar locate

Right now i have configured and working webjar-based Play 2.3.8 application. Recently i tried to use one of bower webjars in it and did not succeed.
More accurately i have
"org.webjars" %% "webjars-play" % "2.3.0-2" and "org.webjars.bower" % "classnames" % "1.1.4" in the plugins.sbt
GET /webjars/*file controllers.WebJarAssets.at(file) in the app/routes
<script src="#routes.WebJarAssets.at(WebJarAssets.locate("classnames.js"))"></script> in some app/views/{file}.scala.html
With all that i'm receiving
IllegalArgumentException: classnames.js could not be found. Make sure
you've added the corresponding WebJar and please check for typos.
on that page.
The error is accurate. That Bower WebJar doesn't have a file named classnames.js in it: http://www.webjars.org/listfiles/org.webjars.bower/classnames/1.1.4
The upstream Bower project doesn't have a file with that name either: https://github.com/JedWatson/classnames

dajax.core ImportError at /No module named

I've installed dajaxice by this tutorial:
Copied folder "dajaxice" (from archive) to project folder.
Added all changes to setting.py & urls.py
Added next lines to template:
{% load dajaxice_templatetags %}
{% dajaxice_js_import %}
Created ajax.py in the project folder
Code from ajax.py:
from django.utils import simplejson
from dajaxice.core import dajaxice_functions
#dajaxice_register
def example1(request):
return simplejson.dumps({'message': 'hello world'})
dajaxice_functions.register(example1)
Code from .js file:
$("#id_submit").click(function(){
Dajaxice.theproject.example1(callback_example);
console.log("test clicked");
return false; });
When I restart the project in browser at first request I got:
ImportError at / No module named dajax.core
Request Method: GET
Request URL: http:// 127.0.0.1:8000/
Django Version: 1.4
Exception Type: ImportError
Exception Value: No module named dajax.core
Exception Location: C:\Python27\lib\importlib\__init__.py in import_module, line 37
Python Executable: C:\Python27\python.exe
Python Version: 2.7.3
Python Path: ['E:\\Projects\\py\\sites\\theproject', 'C:\\Windows\\system32\\python27.zip', 'C:\\Python27\\DLLs', 'C:\\Python27\\lib', 'C:\\Python27\\lib\\plat-win', 'C:\\Python27\\lib\\lib-tk', 'C:\\Python27', 'C:\\Python27\\lib\\site-packages', 'C:\\Python27\\lib\\site-packages\\PIL']
Server time: Fri, 3 Aug 2012 14:50:03 +0300
Any ideas?
load ajax.py in init.py(of main app)
Dajaxice is updating all the time. Make sure you have downloaded and installed the correct version of Dajax for the document you are reading. In your error message, it says, "No module named dajax.core", which is probably because you are using the wrong version.
And the current version of Dajaxice and Dajax can be found here:
https://pypi.python.org/pypi/django-dajax
https://pypi.python.org/pypi/django-dajaxice/0.5.5

Resources