I have done a fresh install of bootstrap version 4.1.1
I created a custom.scss file and put the following in it (straight from bootstrap4 online docs)
// Your variable overrides
$body-bg: #000;
$body-color: #111;
// Bootstrap and its default variables
#import "node_modules/bootstrap/scss/bootstrap";
When I run npm run dis, i'm receiving the following error:
scss/custom.scss
2:1 × Expected !default flag for "$body-bg" scss/dollar-variable-default
3:1 × Expected !default flag for "$body-color" scss/dollar-variable-default
According to bootstraps documentation you must remove the "!default" but the error specifies you must have the "!default".
I'm assuming I'm overlooking something but I can't seem to figure out what it is.
So, the default installation of bootstrap has a file called .stylelintrc. This is the configuration file for stylelint.
For some reason, the example given on bootstraps website is not in alignment to the default configuration of the .stylelintrc file.
You need to change the line
"scss/dollar-variable-default": [false, { "ignore": "local" }]
to
"scss/dollar-variable-default":null
In order to get their example working.
Related
So, I am trying to follow a number of the file pond example and each of them include some form of CSS import (I get it, there is a lot that comes with beauty). However, no matter what I try, Filepond or Pintura (formerly Doka), I get this error in some form:
Compiled with problems:
ERROR in ./node_modules/filepond-plugin-image-preview/dist/filepond-plugin-image-preview.min.css
Module build failed (from ./node_modules/style-loader/dist/cjs.js):
ValidationError: Invalid options object. Style Loader has been initialized using an options object that does not match the API schema.
- options should be an object:
object { injectType?, attributes?, insert?, base?, esModule?, modules? }
at validate (/Users/ryanolson/github/realkinkmen/node_modules/style-loader/node_modules/schema-utils/dist/validate.js:105:11)
at Object.loader (/Users/ryanolson/github/realkinkmen/node_modules/style-loader/dist/index.js:25:29)
ERROR in ./node_modules/filepond/dist/filepond.min.css
Module build failed (from ./node_modules/style-loader/dist/cjs.js):
ValidationError: Invalid options object. Style Loader has been initialized using an options object that does not match the API schema.
- options should be an object:
object { injectType?, attributes?, insert?, base?, esModule?, modules? }
at validate (/Users/ryanolson/github/realkinkmen/node_modules/style-loader/node_modules/schema-utils/dist/validate.js:105:11)
at Object.loader (/Users/ryanolson/github/realkinkmen/node_modules/style-loader/dist/index.js:25:29)
I have NO IDEA how to fix this as I am not experienced enough with what would be going on. I am guessing it has to do with Webpack and build but no idea what I need to do to fix it. Any help?
I also want to mention this is a Laravel/VueJS/Tailwind stack
The solution is to add the CSS files to the app.css file under /resources/css/app.css
#import 'filepond/dist/filepond.min.css';
#import "filepond-plugin-image-preview/dist/filepond-plugin-image-preview.min.css";
I am creating a Qt6 QML module with qt_add_qml_module.
qt_add_qml_module(SQUtils_Logger_Qml
URI SQUtilsLogger.Qml
VERSION 1.0
SOURCES
LoggerQml.cpp
QML_FILES
Log.js
Logm.mjs
LoggerQml.qml
)
But the generated qmldir contains only the information about the qml file: the js and mjs files are missing.
module SQUtils.Logger.Qml
linktarget SQUtils_Logger_Qmlplugin
optional plugin SQUtils_Logger_Qmlplugin
classname SQUtils_Logger_QmlPlugin
typeinfo SQUtils_Logger_Qml.qmltypes
prefer :/SQUtils/Logger/Qml/
LoggerQml 1.0 LoggerQml.qml
It is a problem because when I run ninja all_qmllint, the compiler/linter complains that Log is not defined:
// View.qml
import SQUtils_Logger_Qml
//import "qrc:/SQUtils/Logger/Qml/Log.js" as Log
ApplicationWindow {
Component.onCompleted: {
Log.debug("QML main application complete")
}
}
Warning: View.qml:120:13: Unqualified access
Log.debug("QML main application complete)
If I append Log 1.0 Log.js to the qmldir file, then the linting works.
What I am doing wrong? Is this a bug? The qt documentation for qt_add_qml_module quotes:
QML_FILES lists the .qml, .js and .mjs files for the module. [...]
The files will also be used to populate type information in the generated qmldir file.
Thank you for your help!
Note: I can manage to run my code by uncommenting import "qrc:/SQUtils/Logger/Qml/Log.js" as Log, but the lint still does not work.
It was indeed a Qt bug, corrected two days ago. It will be corrected in versions greater than 6.2.2:
https://bugreports.qt.io/browse/QTBUG-100326
I'm trying to create an web application using Vue.js.
My project is built using Vue-Cli 3 and has the following structure:
-src
-assets
-components
- first
- Base.vue (*)
- refer
- less
- user
- register.less (*)
- store
- views
What I'm trying to do is to import register.less file on to Base.vue file.
Below is the code used in Base.vue file...
<style lang="less>
#import "../report/report.less";
</style>
If I try to run a server using npm run serve,
the following error is thrown:
Module build failed (from ./node_modules/less-loader/dist/cjs.js):
#import "../report/report.less";
^
Can't resolve '../report/report.less' in 'C:\Users\user\my_project\src\components\first'
in C:\Users\user\my_project\src\components\first\Base.vue?vue&type=style&index=0&lang=less& (line 95, column 0)
I'm guessing this error is saying that I'm using the wrong path for importing the less file.
But I can't figure out how to fix it...
Please have a take a look... Thanks.
You are guessing right. The path must be relative. In your case you must go up one level still (via ..). Use:
<style lang="less>
#import "../../refer/less/user/register.less";
</style>
I am working with Buefy/Bulma and Vue-CLI 3.
I get an unknown function inspection info on the SASS function findColorInvert(...) that I import from the bulma utilities.
I have #import "~bulma/sass/utilities/_all" at the top of my scss file which imports functions.sass:
...
#function findColorInvert($color)
#if (colorLuminance($color) > 0.55)
#return rgba(#000, 0.7)
#else
#return #fff
...
Here IntelliJ doesn't even recognize the variable $colorin the function body. Let alone colorLuminance, which is a function defined in the same file.
I have the proper file types set (settings/Editor/File Types: SassStyleSheet:*sass and SCSSStyleSheet:*scss).
When I compile, the correct CSS is generate and I get no error from the CLI.
node_modules/bulma is excluded from indexing because it's not listed as a project direct dependency after installing buefy, so functions defined there can't be resolved. Marking it as Not Excluded (right-click the folder, Mark directory as/Cancel exclusion) should fix the issue
I am writing a Play Framework module in order to share some common logic among multiple Play apps. One of the things I would like my module to do is provide some frequently-used functionality by way of 3rd-party modules, for example the excellent Markdown module.
First of all, is it possible to do this? I want all the apps that include my module to be able to use the .markdown().raw() String extension without needing to explicitly declare the Markdown module as a dependency. The Play Framework Cookbook chapter 5 seems to imply that it is possible, unless I am reading it wrong.
Secondly, if it is possible, how does it work? I have created the following vanilla example case, but I'm still getting errors.
I created a new, empty application "myapp", and a new, empty module "mymod", both in the same parent directory. I then modified mymod/conf/dependencies.yml to:
self: mymod -> mymod 0.1
require:
- play
- play -> markdown [1.5,)
I ran play deps on mymod and it successfully downloaded and installed the Markdown module. Running play build-module also worked fine with no errors.
Then, I modified myapp/conf/dependencies.yml to:
# Application dependencies
require:
- play
- mymod -> mymod 0.1
repositories:
- Local Modules:
type: local
artifact: ${application.path}/../[module]
contains:
- mymod
I ran play deps on myapp and it successfully found mymod, and generated the myapp/modules/mymod file, containing the absolute path to mymod.
I ran myapp using play run and was able to see the welcome page on http://localhost:9000/. So far so good.
Next, I modified myapp/app/views/Application/index.html to:
#{extends 'main.html' /}
#{set title:'Home' /}
${"This is _MarkDown_, by [John Gruber](http://daringfireball.net/projects/markdown/).".markdown().raw()}
I restarted myapp, and now I get the following error.
09:03:23,425 ERROR ~
#6a6eppo46
Internal Server Error (500) for request GET /
Template execution error (In /app/views/Application/index.html around line 4)
Execution error occured in template /app/views/Application/index.html. Exception raised was MissingMethodException : No signature of method: java.lang.String.markdown() is applicable for argument types: () values: [].
play.exceptions.TemplateExecutionException: No signature of method: java.lang.String.markdown() is applicable for argument types: () values: []
at play.templates.BaseTemplate.throwException(BaseTemplate.java:86)
at play.templates.GroovyTemplate.internalRender(GroovyTemplate.java:257)
at play.templates.Template.render(Template.java:26)
at play.templates.GroovyTemplate.render(GroovyTemplate.java:187)
at play.mvc.results.RenderTemplate.<init>(RenderTemplate.java:24)
at play.mvc.Controller.renderTemplate(Controller.java:660)
at play.mvc.Controller.renderTemplate(Controller.java:640)
at play.mvc.Controller.render(Controller.java:695)
at controllers.Application.index(Application.java:13)
at play.mvc.ActionInvoker.invokeWithContinuation(ActionInvoker.java:548)
at play.mvc.ActionInvoker.invoke(ActionInvoker.java:502)
at play.mvc.ActionInvoker.invokeControllerMethod(ActionInvoker.java:478)
at play.mvc.ActionInvoker.invokeControllerMethod(ActionInvoker.java:473)
at play.mvc.ActionInvoker.invoke(ActionInvoker.java:161)
at Invocation.HTTP Request(Play!)
Caused by: groovy.lang.MissingMethodException: No signature of method: java.lang.String.markdown() is applicable for argument types: () values: []
at /app/views/Application/index.html.(line:4)
at play.templates.GroovyTemplate.internalRender(GroovyTemplate.java:232)
... 13 more
And just to confirm I'm not crazy, I tried adding the play -> markdown [1.5,) line to myapp/conf/dependencies.yml and restarted the app, and confirmed that it works.
I feel like I'm missing something obvious. Many thanks in advance to anyone who can help! :)
Yes I had the same problem, it seems that transitive dependencies through custom home made modules does not work