Vuetify SASS not compiling correctly with Nuxt - javascript

I wanna make Vuetify work with Nuxt via Plugin but get the problem of :
Textform:
ERROR in ./node_modules/vuetify/src/components/VProgressLinear/VProgressLinear.sass friendly-errors 21:22:30
Module build failed (from ./node_modules/sass-loader/lib/loader.js): friendly-errors 21:22:30
undefined
^
Invalid CSS after " #content": expected "}", was "($material-light); "
I installed all the necessary Sass Loaders according to Vuetify and Nuxt´s Docs. I set up a Example Repository barebone to recreate the problem. https://github.com/Badgyy/vdling
Sitting on the problem for hours now but didn´t find any suitable solution online, I appreciate any help.

Its because you are using node-sass, while you should be using sass.
Also, I suggest just to use nuxtjs/vuetify module, that will install all deps correctly and do all needed configuration

Related

Missing loader for vuetify even though css-loader and vuetify-loader in package.json

I use vuetify for my web app. I have the necessary vuetify.js and the imports in the files.
When trying to build my app, I get the error:
'Module parse failed: unexpected token. You may need an appropriate loader to handle this file type.'
For tons of vuetify related files in the node_modules folder. For example:
./node_modules/vuetify/lib/components/VSelect/VSelect.js
In my package.json I have:
sass-loader
css-loader
vue-loader
vue-style-loader
vuetify-loader
And a couple more defined (of which I think they have nothing to do with vuetify).
Could I be missing one? Do I need to define which one to use for the vuetify files?
Might be important to add: I don't have a webpack.config.js, therefore I cannot use the explanation on vuetify quickstart. Do I need a webpack.config to be able to solve this problem?

Angularjs failed to instantiate module thitch ’angular-file-saver’

How to right add angular-file-saver in AngularJS project?
I trying to implement: angular-file-saver (FileSaver.js version for Angularjs) But it's not working.
1) installing filesaver file upload via bower with the command:
bower install angular-file-saver --save
2) I am trying to addition FileSaver.js module in app.js , but in browser console after starting have error:
window.mmvvtApp = angular.module('mmvvt', ['ngBootstrap', 'ngFileSaver',...
Failed to instantiate module mmvvt due to:
Error: [$injector:modulerr] http://errors.angularjs.org/1.2.26/$injector/modulerr?p0=...)
If i remove the 'ngFileSaver' from function then I am not facing the issue but when I put it in the function legislator and try to call it I get the issue.
May be non compatible versions: AngularJS#1.2.26 and angular-file-saver#1.1.3 don’t work together ?
Can someone help me please?
Thank you.
Earned after include in file "WEB-INF/jsp/main.jsp" next code:
<script src="bower_components/angular-file-saver/dist/angular-file-saver.bundle.js"></script>
AngularJS#1.2.26 and angular-file-saver#1.1.3 work together correctly.

Unable to compile and publish my Typescript library using webpack or TSC

Ive created a library that helps to trace an object state using rx streams and
Im trying to publish it to npm community.
you can check this out In my github repo
I want to compile my library to a single Javascript file and also create a declaration file ".d.ts" for Typescript users.
As i understand, when running $ npm publish i release my entire repository. what i want is to release the dist folder with the library source and declaration file and so the end users will be able to debug my library if necessary through their code so i need also source map.
So first i need to compile my src directory to a single javascript file and i have 2 ways to do so, using tsc or with webpack.
What ive tried so far and you should know:
I used module alias, configured in tsconfig.json.
I separated the library's bussiness logic to multiple files.
I wanted to import internal library's modules using "#lib" prefix.
so in my tsconfig.json i added:
"paths": {
"#lib/*": [
"src/*"
]
},
That alone cause some problems.
first of all running the command:
$ tsc src/index.ts
doesn't work at all and it shows me an error:
src/index.ts(3,15): error TS2307: Cannot find module '#lib/state-traceable'.
src/index.ts(4,15): error TS2307: Cannot find module '#lib/traceable-decorator'. src/index.ts(5,15): error TS2307: Cannot find module '#lib/effect-decorator'.
src/index.ts(6,15): error TS2307: Cannot find module '#lib/meta'.
yet running the command:
$ tsc
does actually works but it compiles each source file and create declaration file for each one of them.
Additionally, it preserves the path alias "#lib/*" instead of compiling it to something javscript compatible with relative paths "../", "./" etc...
Using webpack:
I succeed to bundle all my library sources to a single file and get rid of the "#lib" prefix however im not able to create a single declaration file.
im using "awesome-typescript-loader" plugin for webpack.
I created an issue, thought its a bug but i yet received any response from them:
https://github.com/s-panferov/awesome-typescript-loader/issues/559
Also tried to get some help from Gitter chats, Typescript community, "awesome-typescript-loader" library has no dedicated chat but couldn't find any useful information. Most of the examples ive seen, Typescript library publishers used to create a single file in their source directory: "index.ts" and it makes life easier because you can use tsc and compile that single file to a javascript file.
I hope i will find salvation here.
Some general info about the environment itself:
OS: Windows 10 Pro
Node Version: 9.5.0
npm version: 5.6.0
webpack version: 4.2.0
Please use the path configuration like below
"paths": {
"#lib/state-traceable": ["src/state-traceable.ts"],
"#lib/meta": ["src/meta.ts"],
"#lib/effect-decorator": ["src/effect-decorator.ts"],
"#lib/traceable-decorator": ["src/traceable-decorator.ts"],
"#lib/contracts/*": ["src/contracts/*"],
"#lib/utils/*": ["src/utils/*"],
"#lib/rx-operators/*": ["src/rx-operators/*"]
},

jarsigner: unable to sign jar: java.util.zip.ZipException: duplicate entry: org/appcelerator/titanium/gen/bindings.json

I am facing issue while using custom module in titanium application:-
[ERROR] : Failed to sign apk:
[ERROR] : jarsigner: unable to sign jar: java.util.zip.ZipException: duplicate entry: org/appcelerator/titanium/gen/bindings.json
I have created new custom module for android and I am trying to use this module in my application but at run time I am getting above error.
I didn't get any solution yet please share if anyone have any idea related to this issue.
Thanks
Long discussion regarding this error on the Appc JIRA (https://jira.appcelerator.org/browse/TIMOB-23502)
From the PR (https://github.com/appcelerator/titanium_mobile/pull/8551) looks like you will have to wait until 6.1.0 for the fix, or build a new sdk from master, or cherry pick the fixes into your current SDK.
In the discussion, Sean Conway offered a solution (https://jira.appcelerator.org/browse/TIMOB-23502?focusedCommentId=393172&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-393172) that worked for some folks, but not others.
I was able to remove the gen/bindings.json file by doing the following:
(1) Set Java Compiler to 1.8
(2) Update build.properties:
titanium.platform=/Users/xxx/Library/Application Support/Titanium/mobilesdk/osx/5.4.0.GA/android
android.platform=/Users/xxx/Library/android-sdk-macosx/platforms/android-23
android.ndk=/Users/xxx/android-sdks/build-tools/22.0.1/android-ndk-r10e
(3) Change all libraries in build path to use 5.4.0.GA JARS
(4) Delete build and dist folders then rebuild using ANT *** WIll not work otherwise, still produces gen file if you package-->android module
DO not use package option to build, go to build.xml, right click-->Run as Ant Build
Successful project build

cannot find module breeze with browserify

I am attempting to load breeze using browserify. I used npm to install the breeze-client library. If I run browserify without including breeze everything runs fine, but when I include breeze I get the following error:
Error: Cannot find module 'breeze' from 'C:\...\node_modules\breeze-client'
I've tried doing the require every way I can think of
require("breeze-client");
require("breeze-client/breeze.debug");
require("breeze-client/breeze.debug.js");
require("../node_modules/breeze-client");
// etc...
Only thing I can think of now is that there is an issue with the module that's causing a problem with browserify.
Does anyone know of a change that can be made to the module to get this to work or is there some setting in browserify that I need to use?
Complete error message when trying to run browserify directly on the breeze module:
C:\...>browserify "node_modules/breeze-client" -o "scripts/dist/breeze.js"
Error: Cannot find module 'breeze' from 'C:\...\node_modules\breeze-client'
at C:\...\node_modules\browserify\node_modules\resolve\lib\async.js:46:17
at process (C:\...\node_modules\browserify\node_modules\resolve\lib\async.js:173:43)
at ondir (C:\...\node_modules\browserify\node_modules\resolve\lib\async.js:188:17)
at load (C:\...\node_modules\browserify\node_modules\resolve\lib\async.js:69:43)
at onex (C:\...\node_modules\browserify\node_modules\resolve\lib\async.js:92:31)
at C:\...\node_modules\browserify\node_modules\resolve\lib\async.js:22:47
at FSReqWrap.oncomplete (fs.js:95:15)
need to make sure all references to require("breeze") were updated to require("breeze-client") inside the breeze.debug.js file as well as any adapters you might include from the build/adapters directory.
There is a pull-request in to fix this so hopefully it won't be a problem in future versions.

Categories

Resources