Tag Archives: front end

[Solved] Vue Error: Error in v-on handler (Promise/async): “[object object]“

[Solved] Vue Error: Error in v-on handler (Promise/async): “[object object]“

Solution:

Use try_ catch package async… await function

  /**
   * export
   */
  async download () { // export
    try {
      const { parkName } = this.formInline
      const res:any = await exportInvoice({ parkName })
      this.downSteam(res)
    } catch (_) {}
  }

[Solved] Error: error:0308010C:digital envelope routines::unsupported

Error: error:0308010C:digital envelope routines::unsupported

npm run serve error: error:0308010C

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:133:10)
    at module.exports (D:\Item\springbootVue\springboot\vue\node_modules\webpack\lib\util\createHash.js:135:53)
    at NormalModule._initBuildHash (D:\Item\springbootVue\springboot\vue\node_modules\webpack\lib\NormalModule.js:417:16)
    at handleParseError (D:\Item\springbootVue\springboot\vue\node_modules\webpack\lib\NormalModule.js:471:10)
    at D:\Item\springbootVue\springboot\vue\node_modules\webpack\lib\NormalModule.js:503:5

Solution:
set NODE_OPTIONS=–openssl-legacy-provider

D:\Item\springboot\vue>set NODE_OPTIONS=--openssl-legacy-provider

D:\Item\springboot\vue>npm run serve

> [email protected] serve
> vue-cli-service serve

It can run successfully

The main reason is the incompatibility of versions

[Solved] Error:The above error occurred in one of your React components & A component suspended while respondi

lazyLoad of routing components, lazy loading problem, when using the lazy function of react in conjunction with the import() function to dynamically load routing components.

import React, { Component, lazy } from 'react'
·······

const Login = lazy(()=>import('XXXX'))

The following errors will be reported:

Error analysis: suspended=> When the network speed is slow and the specified routing component page is not loaded, you need to use the fallback in suspend to load the contents of the fallback before the specified page appears.

Solution:

import React, { Component, lazy,Suspense } from 'react'
·····

const Home = lazy(()=> import('./Home'))
const About = lazy(()=> import('./About'))

·······
<Suspense fallback={<h2>Loading..</h2>}>
  <Routes>
     <Route path="/about" element={<About/>}/>
     <Route path="/home" element={<Home/>}/>
   </Routes>
</Suspense>

[Solved] docker Error response from daemon OCI runtime create failed container_linux.go380

docker: Error response from daemon: OCI runtime create failed: container_ linux. Go:380 error 

Docker fails to run after installing mysql5.7, and reports error: OCI runtime create failed

Pull mysql5.7 on docker is OK
execute the code and report an error

docker run -p 3306:3306 --name mysql 

-v /mydata/mysql/log:/var/log/mysql
-v /mydata/mysql/data:/var/lib/mysql
-v /mydata/mysql/conf:/etc/mysql
-e MYSQL_ ROOT_ PASSWORD=root
-d mysql:5.7

cd to /mydata/mysql/conf and finds that it is not mounted correctly, and there is no /etc/mysql file path

Reason for error: because of the compatibility between Linux and docker version, the docker version needs to be degraded or reinstalled

There are two solutions:

  1. Reinstall the specified version of docker
  2. Downgrade docker to the specified version

The first method: uninstall and reinstall:

//Step 1: Uninstall docker

//List the packages downloaded by docker
sudo yum list installed | grep docker

//remove all the above related installed packages sudo yum -y remove "above show related packages"
sudo yum -y remove docker-ce.x86_64
sudo yum -y remove docker-ce-cli.x86_64

// Remove related images and containers
sudo rm -rf /var/lib/docker

sudo yum remove docker 
              docker-client 
              docker-client-latest 
              docker-common 
              docker-latest 
              docker-latest-logrotate 
              docker-logrotate 
              docker-selinux 
              docker-engine-selinux 
              docker-engine
                 
//Test for deletion
docker -v


// Step 2: reinstall the specified version of docker

// Install some necessary system tools.
sudo yum install -y yum-utils device-mapper-persistent-data lvm2

// Add software source information: sudo yum-config -y
sudo yum-config-manager --add-repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo

//Update the yum cache.
sudo yum makecache fast

//View the available versions of Docker-ce: sudo yum list docker-ce
yum list docker-ce --showduplicates | sort -r

// If you need to show only table versions, you can turn off the list for test versions: yum list
sudo yum-config-manager --enable docker-ce-edge
sudo yum-config-manager --enable docker-ce-test

//Update the yum package index
yum makecache fast

//Install the specified version of docker-ce: sudo yum install -y docker-ce
sudo yum install -y docker-ce-17.03.2.ce-1.el7.centos 

// Error: If the installation of the specified version of docker shows that the specified version of the docker-ce-selinux dependency package needs to be installed, please install.
yum install -y https://download.docker.com/linux/centos/7/x86_64/stable/Packages/docker-ce-selinux-17.03.2.ce-1.el7.centos.noarch.rpm 

Then pull MySQL again

docker pull mysql:5.7

The second method: downgrade docker to the specified version:

//stop docker
sudo systemctl stop docker
//Enter the downgrade command
yum downgrade --setopt=obsoletes=0 -y docker-ce-17.03.2.ce-1.el7 docker-ce-selinux-17.03.2.ce-1.el7 containerd.io
//Checking the docker version
docker -v

Recreate container and start

docker run -p 3306:3306 --name mysql 

-v /mydata/mysql/log:/var/log/mysql
-v /mydata/mysql/data:/var/lib/mysql
-v /mydata/mysql/conf:/etc/mysql
-e MYSQL_ ROOT_ PASSWORD=root
-d mysql:5.7

[Solved] Logging system failed to initialize using configuration from ‘classpathlogbacklogback-spring.xml‘

2021-12-31:

The project works fine on Windows, but when it is moved to a Mac system, an error appears!

According to the error message, the initialization of “logback-spring.xml” failed, and the configuration of “Logback” was detected as an error and an illegal exception was declared,

Failed to create a parent directory for “[/apps/logs/sns_error.log]”…

The main reason is that the initialization of the configuration file failed, and then the following error was reported.

First, let’s take a look at the input location of the log file defined in the configuration file, as shown below.

The specific error information is as follows:

Logging system failed to initialize using configuration from ‘classpath:logback/logback-spring.xml’
java.lang.IllegalStateException: Logback configuration error detected:
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[ERROR] - Failed to create parent directories for [/apps/logs/sns_error.log]
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[ERROR] - openFile(/apps/logs/sns_error.log,true) call failed. java.io.FileNotFoundException: /apps/logs/sns_error.log (No such file or directory)
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[WARN] - Failed to create parent directories for [/apps/logs/sns_warn.log]
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[WARN] - openFile(/apps/logs/sns_warn.log,true) call failed. java.io.FileNotFoundException: /apps/logs/sns_warn.log (No such file or directory)
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[INFO] - Failed to create parent directories for [/apps/logs/sns_info.log]
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[INFO] - openFile(/apps/logs/sns_info.log,true) call failed. java.io.FileNotFoundException: /apps/logs/sns_info.log (No such file or directory)
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[DEBUG] - Failed to create parent directories for [/apps/logs/sns_debug.log]
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[DEBUG] - openFile(/apps/logs/sns_debug.log,true) call failed. java.io.FileNotFoundException: /apps/logs/sns_debug.log (No such file or directory)
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[TRACE] - Failed to create parent directories for [/apps/logs/sns_trace.log]
ERROR in ch.qos.logback.core.rolling.RollingFileAppender[TRACE] - openFile(/apps/logs/sns_trace.log,true) call failed. java.io.FileNotFoundException: /apps/logs/sns_trace.log (No such file or directory)

Let’s continue with the above

It should be that I don’t know its features very well when I just use Mac, and I don’t know whether it’s caused by different computer environments (I can’t create this directory on MAC)

Follow up: 2021-12-31 PM

Background Note: On Windows my project is in a folder on the D: drive, and today I found the “/apps/logs” directory on the D: drive, just like the path in the configuration below.

When I change the input location of the configuration file to “/apps/logs/sns”, the folder of “SNS” appears on disk D.

As shown in the following figure:

This shows that when the value in this configuration is “relative path”, it will be created in the root directory of the disk where the project is located (for example, if the project is on disk d: then the path is “d:+ relative path”).

Follow up: December 31, 2021

After opening the folder, I found that the following log was created, and then I looked at the error message. It can completely explain the reason for the error: the folder path cannot be created, and then the log file cannot be created, and the log file failed to be opened.

Then reported an error!!

The created log file is shown in the following figure:

The error information is shown in the following figure:

The solution must start with why the file path is not created on the Mac.

There is no concept of disk partition on Mac. Is it because of this reason that you can’t create a path.

Finally, I found the Solution:

On Mac when I remove the backslash at the top of “/apps/logs/sns” and change it to “apps/logs/sns”, it runs successfully

[vite] Failed to parse source for import analysis because the content contains invalid JS syntax.

 

While developing a Vue.js 3.0 project using the vite tool, a configuration issue caused the project to run with the following error message:

16:17:27 [vite] page reload main.js
Failed to parse source for import analysis because the content contains invalid JS syntax. Install @vitejs/plugin-vue to handle .vue files.
16:17:28 [vite] Internal server error: Failed to parse source for import analysis because the content contains invalid JS syntax. Install @vitejs/plugin-vue to handle .vue files.
  Plugin: vite:import-analysis
  File: /home/projects/vitejs-vite-der4uu/App.vue

We need to install the plug-in @@vitejs/plugin-vue that uses error prompts.

The solution steps are as follows:

1. Install dependent plug-ins first

npm install @vitejs/plugin-vue -D

2. Then configure the vite project configuration file: vite.config.js

// vite.config.js
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
});

In this way, we have configured the vite project to recognize the ability to parse single-file components with a .vue suffix.

3. Rerun

npm run dev

This is the problem. It is solved perfectly.

[Solved] Failed to bind properties under ‘spring.datasource.type‘ to java.lang.Class<javax.sql.DataSource>

In the springcloud project, the following error occurs when starting:

***************************
APPLICATION FAILED TO START
***************************
Description:
Failed to bind properties under ‘spring.datasource.type’ to java.lang.Class<javax.sql.DataSource>:
Property: spring.datasource.type
Value: com.zaxxer.hikari.HikariDataSource
Origin: “spring.datasource.type” from property source “bootstrapProperties-config/application/”
Reason: No converter found capable of converting from type [java.lang.String] to type [java.lang.Class<javax.sql.DataSource>]
Action:
Update your application’s configuration
Disconnected from the target VM, address: ‘127.0.0.1:63170’, transport: ‘socket’
Process finished with exit code 1

Solution: Add the following reference to the pom file

        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
        </dependency>

Attach POM file

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <artifactId>cloud-plateform-parent</artifactId>
        <groupId>org.shr</groupId>
        <version>1.0.3.RELEASE</version>
    </parent>
    <artifactId>aiservice</artifactId>
    <description>Demo project for Spring Boot</description>
    <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-starter</artifactId>
        </dependency>
        <!-- http核心 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>io.grpc</groupId>
            <artifactId>grpc-all</artifactId>
            <version>1.12.0</version>
        </dependency>
        <dependency>
            <groupId>com.google.protobuf</groupId>
            <artifactId>protobuf-java</artifactId>
            <version>3.17.3</version>
        </dependency>
        <dependency>
            <groupId>org.postgresql</groupId>
            <artifactId>postgresql</artifactId>
        </dependency>
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid-spring-boot-starter</artifactId>
            <version>1.1.13</version>
        </dependency>
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.47</version>
        </dependency>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-starter-consul-all</artifactId>
        </dependency>
        <dependency>
            <groupId>com.google.protobuf</groupId>
            <artifactId>protobuf-java-util</artifactId>
            <version>3.17.3</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-tx</artifactId>
            <version>5.3.14</version>
        </dependency>
        <dependency>
            <groupId>org.springframework.cloud</groupId>
            <artifactId>spring-cloud-openfeign-core</artifactId>
            <version>2.2.9.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis-spring</artifactId>
            <version>2.0.6</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-autoconfigure</artifactId>
            <version>2.2.1</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis</artifactId>
            <version>3.5.9</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-jdbc</artifactId>
            <version>5.3.14</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
        </dependency>


    </dependencies>
    <build>
        <finalName>shr-centralized-inspect-service</finalName>
        <!-- os system information plugin, protobuf-maven-plugin needs to get the system information to download the corresponding protobuf program -->
        <extensions>
            <extension>
                <groupId>kr.motd.maven</groupId>
                <artifactId>os-maven-plugin</artifactId>
                <version>1.6.2</version>
            </extension>
        </extensions>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>3.8.0</version>
                <configuration>
                    <source>1.8</source>
                    <target>1.8</target>
                    <encoding>UTF-8</encoding>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.xolstice.maven.plugins</groupId>
                <artifactId>protobuf-maven-plugin</artifactId>
                <version>0.5.0</version>
                <configuration>
                    <pluginId>grpc-java</pluginId>
                    <protocArtifact>com.google.protobuf:protoc:3.0.2:exe:${os.detected.classifier}</protocArtifact>
                    <pluginArtifact>io.grpc:protoc-gen-grpc-java:1.2.0:exe:${os.detected.classifier}</pluginArtifact>
                    <!-- proto file directory -->
                    <protoSourceRoot>${project.basedir}/src/main/proto</protoSourceRoot>
                    <!-- Generated Java files directory -->
                    <outputDirectory>${project.basedir}/src/main/java/</outputDirectory>
                    <clearOutputDirectory>false</clearOutputDirectory>
                </configuration>
                <executions>
                    <execution>
                        <goals>
                            <goal>compile</goal>
                            <goal>compile-custom</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

</project>

[Solved] Module build failed TypeError this.getOptions is not a function at Object.loader

How to Solve error: Module build failed TypeError this.getOptions is not a function at Object.loader

Solution: Reduce the current style-loader version

npm install -save -dev [email protected]
npm install -save -dev [email protected]
npm install --save-dev [email protected] less

[Solved] VSCode package Error: Command failed: npm list –production –parseable –depth=99999 –loglevel=error

After VSCode package, there is an error report: command failed: NPM list –production –parseable –depth=99999 –loglevel=error appears. missing: vsce@^2.10.0, required by [email protected]

Note: this error pops up when I try to package the vscode plug-in

I found that many situations may lead to this error Command failed: npm list --production --parseable --depth=99999 --loglevel=error. Please pay attention.

reason

After some troubleshooting, I found that the reason I got this error was because I started installing the vsce package in the current location, and then I decided that it was wrong and changed it to a global installation. Then, instead of uninstalling vsce from the current location, I just deleted the node_modules folder. The error occurred because the vsce package command was not executed correctly because it was not uninstalled and then deleted.

 

Solution:

Reinstall the vsce package at the current location, npm install vsce,

Use npm uninstall vsce to uninstall.

Finally, you can choose to delete node_modules folder.

 

[Solved] vueCli 4.x Upgrade to 5.x Error: Progress Plugin Invalid Options

Running the compile command after upgrading vueCli 4.x to 5.x may result in the following error:

ERROR  ValidationError: Progress Plugin Invalid Options
 
        options should NOT have additional properties
        options should NOT have additional properties
        options should NOT have additional properties
        options should pass "instanceof" keyword validation
        options should match exactly one schema in oneOf

This may be caused by the inconsistency between the locally installed version of webpack and the version of vue-cli.

Solution:

1. Check if the webpack version in node_modules is also upgraded to version 5.x. If not, upgrade to version 5.x.

2. Check if the devServer in vue.config.js has overlay configuration, this configuration will be incompatible in vue-cli 5.x version, you have to remove it, otherwise it will also report an error when running

3. delete the wrong node_modules and package-lock.json

4. Clear npm cache: npm cache clean –force

5. reinstall the dependencies: npm install

 

[Solved] Vue Project Error: error ‘v-model‘ directives require no argument vue/valid-v-model

In Vue projects, you need to reference third-party libraries, such as vant@^2.12.47. When using the dialog popup component, you need to use v-model:show to determine whether to display the popup.

When the project is running, an error will be reported: error ‘v-model’ directives require no argument vue/valid-v-model

Solution: Add:'vue/valid-v-model':'off' in the root directory, .eslintrc.js file.

As shown in the figure: