Summary of problems encountered by Vue3 in creating projects
1.Uncaught SyntaxError: The requested module '/node_modules/.vite/vue-router.js?v=4b09f9b8' does not provide an export named 'default'
[solution]
Configuration file of Vue Router:
Scheme I:
import * as VueRouter from 'vue-router'
import routes from './routers'
const router = VueRouter.createRouter({
history: VueRouter.createWebHashHisto ...
Posted by jpschwartz on Tue, 01 Mar 2022 16:58:30 +0100
Sass basic learning
Coding rules
It is recommended to explicitly define @ charset "encoding name" at the beginning of the code, Enable SASS to compile the output according to the given character set.
variable
$font-stack: Helvetica, sans-serif;
$primary-color: #333;
body {
font: 100% $font-stack;
color: $primary-color;
}
body {
font: 100% ...
Posted by april2008 on Fri, 18 Feb 2022 01:30:54 +0100
Basic use of Scss (@ extend, @ mixin, @ import, @ if, @ for, @ while, @ each)
Portal: basic use of Scss (variable, nested) Portal: Sass Chinese network Portal: Sass tutorial | rookie tutorial
1. Inheritance (@ extend)
@The extend instruction tells Sass that the style of one selector is inherited from another selector. Using @ extend is useful if one style is almost the same as another with only a few differences.
< ...
Posted by shellyrobson on Fri, 11 Feb 2022 11:18:31 +0100
Node sass generates source map / listening file
Node sass generates source map / listening file
0. Irrelevant (can be skipped)
Problems encountered - > >
I don't know how to use node sass to generate the source map file. It can be generated directly in my local ruby environment
But now the project is to change all the saas files compiled in ruby to node sass. The ...
Posted by Invincible on Fri, 03 Jan 2020 20:25:54 +0100
sass - nested rule
I. Basic nesting rules
A given rule block can contain attributes like normal CSS and nest other rule blocks
#content {
article {
h1 { color: #333 }
p { margin-bottom: 1.4em }
}
aside { background-color: #EEE }
}
/* After compilation */
#content article h1 { color: #333 }
#content article p { margin-bottom: 1.4e ...
Posted by TaosBill on Wed, 18 Dec 2019 21:02:12 +0100
Uncover Vue - vue-cli3 comprehensive configuration
vue-cli3-config
Create project
Configure environment variables
select different environments by adding -- mode xxx to the scripts configuration item in package.json
Create. Env,. Env. Production,. Env.analyz and other files in the root directory of the project
...
Posted by Mistah Roth on Tue, 10 Dec 2019 23:22:25 +0100
Two schemes for users to customize the theme color of a project
Preface
You should have seen many websites that can change the theme or theme color. If you want to change the built-in scheme, you can directly replace the css file, we won't talk about it. This article introduces a simple scheme of user-defined theme color replacement!
1. Relevant knowledge points
1.1 CSSStyleSheet.insertRule()
CSSStyleSheet ...
Posted by Black Rider on Tue, 03 Dec 2019 16:36:48 +0100
How does Javascript share variables with sass, less, and CSS?
Original blog address, this blog was first published in csdn, original
Some time ago, I met the need of website skin changing. I thought it would be very simple. Just use Sass or Less to set variables. The result is the style set in js
It has to be set up separately. It's troublesome.
This article code gitHub address https://github.com/l-x-f/va ...
Posted by clay1 on Sat, 30 Nov 2019 06:58:56 +0100
Solutions common to scss in vue
Sketch
Recently, due to project requirements, many articles about scss public have been reviewed. Here is a brief summary of those articles
Solution
a. When we want to use the sharing of scss files, first we need to think about how we should edit scss files, such as reducing the coupling between variables and mixing in scss files. We can sepa ...
Posted by Drezard on Thu, 28 Nov 2019 05:20:57 +0100
scss instruction notes
instructions
@import
If you need to import an scss or Sass file, but do not want to compile it into CSS, just underline the name of the scss file,
@media query
Query conditions are also allowed to be nested
@media screen {
.sidebar {
@media (orientation: landscape) {
width: 500px;
}
}
}
// Compilation result:
@media scree ...
Posted by 7pm on Sun, 17 Nov 2019 16:11:59 +0100