一切福田，不離方寸，從心而覓，感無不通。

Category Archives: Vue

vue vue-style-loader !css-loader错误

最近在学习vue框架，使用webpack打包vue项目，在执行npm run start的时候 出现如下错误： This dependency was not found: * !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-1d57e5ea","scoped":false,"hasInlineConfig":false}!stylus-loader?{"sourceMap":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./a.vue in ./src/components/a.vue To install it, you can run: npm install --save !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-1d57e5ea","scoped":false,"hasInlineConfig":false}!stylus-loader?{"sourceMap":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./a.vu   解决思路： npm install sass-loader --save; npm install node-sass --save; 然后运行npm run start就可以   from:https://www.cnblogs.com/hexiaobao/p/8260858.html

龙生   25 Oct 2021
View Details

vue中加载loading

首先在components文件夹中新建一个loading.vue组件:   1.loading.vue组件内容如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<template>
 
<div class="markbox" v-show="loading" style="background-color: rgba(0, 0, 0, 0.5);">
 
<div class="sun-loading"></div>
 
</div>
 
</template>
 
 
 
<script>
 
export default {
 
name: 'loading',
 
data() {
 
return {
 
loading: false
 
}
 
},
 
created() {
 
var that = this;
 
this.bus.$on('loading', function(data) {
 
that.loading = !!data;
 
})
 
}
 
}
 
</script>

  css代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
/*loading开始*/
 
.sun-loading {
 
width: 45px;
 
height: 45px;
 
display: block;
 
animation: sunLoading 1s steps(12, end) infinite;
 
background: transparent url('data:image/gif;base64,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');
 
background-size: 100%;
 
margin:auto;
 
position:absolute;
 
top: 0;
 
left: 0;
 
bottom: 0;
 
right:0;
 
}
 
/*loading结束*/

   2.app.vue中设置：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<template>
 
<div id="app">
 
<router-view/>
 
<loading></loading>
 
</div>
 
</template>
 
<script>
 
import loading from '@/components/common/loading'
 
export default {
 
name: 'App',
 
components:{loading}
 
}
 
</script>

  3.在main.js中设置  

1
Vue.prototype.bus = new Vue;

  4.在.vue组件中使用

1
2
3
4
5
6
7
8
9
// 显示loading
 
this.bus.$emit('loading', true);
 
 
 
// 关闭loading
 
this.bus.$emit('loading', false);

  效果如下:   from:https://blog.csdn.net/liangmengbk/article/details/90201596

龙生   27 Sep 2021
View Details

vue中引用vant，附带样式

1、首先 npm install babel-plugin-import 和 npm install vant 2、样式在项目中的  .babelrc 文件下 ["import", {"libraryName": "vant","libraryDirectory": "es","style": true}, "vant"]]  //vant样式引用 3、在main.js中 import { Button } from 'vant'   //引用vant组件库中可用组件 Vue.use(Button )  注册组件即可。 from:https://www.cnblogs.com/1rookie/p/12660684.html

龙生   14 Sep 2021
View Details

Module build failed: error:couldn’t find preset "env" relative to directory

解决办法参考：https://github.com/babel/babel-preset-env/issues/186 即在命令行输入命令安装模块：npm install babel-preset-env   from:https://blog.csdn.net/acoolgiser/article/details/88814071

龙生   30 Aug 2021
View Details

移动端手写签名插件 vue

第一步

1
npm install vue-signature

  第二步 main.js

1
2
import vueSignature from "vue-signature"
Vue.use(vueSignature)

  vue

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<template>
    <div id="app">
        <vueSignature
            ref="signature"
            :sigOption="option"
            :w="'800px'"
            :h="'400px'"
            :disabled="disabled"
            :defaultUrl="dataUrl"
        ></vueSignature>
        <vueSignature ref="signature1" :sigOption="option"></vueSignature>
        <button @click="save">Save</button>
        <button @click="clear">Clear</button>
        <button @click="undo">Undo</button>
        <button @click="addWaterMark">addWaterMark</button>
        <button @click="handleDisabled">disabled</button>
    </div>
</template>
<script>
export default {
    name: "app",
    data() {
        return {
            option: {
                penColor: "rgb(0, 0, 0)",
                backgroundColor: "rgb(255,255,255)",
            },
            disabled: false,
            dataUrl:
                "https://avatars2.githubusercontent.com/u/17644818?s=460&v=4",
        };
    },
    methods: {
        save() {
            var _this = this;
            var png = _this.$refs.signature.save();
            var jpeg = _this.$refs.signature.save("image/jpeg");
            var svg = _this.$refs.signature.save("image/svg+xml");
            console.log(png);
            console.log(jpeg);
            console.log(svg);
        },
        clear() {
            var _this = this;
            _this.$refs.signature.clear();
        },
        undo() {
            var _this = this;
            _this.$refs.signature.undo();
        },
        addWaterMark() {
            var _this = this;
            _this.$refs.signature.addWaterMark({
                text: "mark text", // watermark text, > default ''
                font: "20px Arial", // mark font, > default '20px sans-serif'
                style: "all", // fillText and strokeText, 'all'/'stroke'/'fill', > default 'fill
                fillStyle: "red", // fillcolor, > default '#333'
                strokeStyle: "blue", // strokecolor, > default '#333'
                x: 100, // fill positionX, > default 20
                y: 200, // fill positionY, > default 20
                sx: 100, // stroke positionX, > default 40
                sy: 200, // stroke positionY, > default 40
            });
        },
        fromDataURL(url) {
            var _this = this;
            _this.$refs.signature.fromDataURL(
                "data:image/png;base64,iVBORw0K..."
            );
        },
        handleDisabled() {
            var _this = this;
            _this.disabled = !_this.disabled;
        },
    },
};
</script>

  from:https://blog.csdn.net/XLL20001022/article/details/101548655

龙生   30 Aug 2021
View Details

vue项目打包后css背景图路径不对的问题

问题描述： 自己在自学vue做项目的过程中，遇到一个有关背景图片路径的问题，就是css代码中背景图片是根据相对路径来写的，如下图： 当使用npm run dev命令本地访问的时候，背景图片是正常显示的，可使用npm run build命令打包后，访问dist目录下的项目，页面背景图路径就不对了，显示不出背景图。如下两张图对比 图一：使用npm run dev命令访问   图二：使用npm run build命令打包之后，访问dist目录下的文件，出现的问题，背景图片路径变成了http://127.0.0.1:9000/static/css/static/img/login-bg.0271ef1.jpeg，而实际在dist目录下，图片路径是这样的，如下图   解决办法： 解决办法为：只需要在build/utils.js文件中添加如下一行代码即可。

1
publicPath:'../../'

添加位置为如下图：   然后重新执行 npm run build 命令，即可成功显示图片   from:https://www.cnblogs.com/libo0125ok/p/9361038.html

龙生   28 Apr 2021
View Details

npm install --save 、--save-dev 、-D、-S 的区别与NODE_ENV的配置

备注：<=> 意为等价于； 1、npm install <=> npm i --save   <=> -S --save-dev  <=> -D npm run start <=> npm start  // 对应"scripts"里的"start"命令 少敲几下键盘，何乐而不为 2、npm i --save-dev  <packname>   工程构建（开发时、“打包”时）依赖 ；例：xxx-cli , less-loader , babel-loader… 3、npm i --save <packname>  项目（运行时、发布到生产环境时）依赖；例：antd , element,react… 4、对应关系如下（至于我们啥时候用--save、啥时候用--save-dev 感觉是个规范问题，用反了项目一样可以跑起来（对于安装依赖正确时），但会给其他看你项目的人带来误解、可能会导致一些bug的出现，还有一些配置的错乱等） 5、使用 npm i 安装package.json里的依赖时，两部分的包都会pull下来 5-1、使用 --prod、 npm i --prod <=> npm i --production  // 仅会拉取dependencies中的依赖 5-2、设置NODE_DEV=production时            // 效果同上，仅会拉取dependencies中的依赖 (注意等号两边没空格) 5-2-1、命令行设置（注意不同环境时的"分割符"） window => cmd ：set NODE_ENV=production && xxxx mac      => shell  : NODE_ENV=production 空格 xxxx 5-2-2、package.json=>script命令中设置 彩蛋：在新建package.json文件时，我们可以使用npm init -y 快速创建（yes 表示一路默认创建，还有 -f 表示 force）   from:https://blog.csdn.net/jwl_willon/article/details/81054978

龙生   22 Apr 2021
View Details

vue 安装遇到权限问题 解决

解决方案： npm config set user 0 npm config set unsafe-perm true   报错： Unable to save binary /var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor/linux-x64-64 : { Error: EACCES: permission denied, mkdir '/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor' at Object.mkdirSync (fs.js:753:3) at sync (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/mkdirp/index.js:71:13) at Function.sync (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/mkdirp/index.js:77:24) at checkAndDownloadBinary (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/scripts/install.js:114:11) at Object.<anonymous> (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/scripts/install.js:157:1) at Module._compile (internal/modules/cjs/loader.js:689:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10) at Module.load (internal/modules/cjs/loader.js:599:32) at tryModuleLoad (internal/modules/cjs/loader.js:538:12) at Function.Module._load (internal/modules/cjs/loader.js:530:3) errno: -13, syscall: 'mkdir', code: 'EACCES', path: '/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor' } > node-sass@4.11.0 postinstall /var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass > node scripts/build.js ———————————————— 版权声明：本文为CSDN博主「T&amp;K」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。 原文链接：https://blog.csdn.net/sinat_41780498/article/details/88737365

龙生   16 Apr 2021
View Details

Vue watch 中 this 注意事项

在watch中使用this要注意，不能用箭头函数，否则会出错，例如：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<template>
</template>
<script>
export default{
data(){
return {
isLogin: false
}
},
watch:{
isLogin: (newVal, oldVal) => {
newVal && this.updateLogin()
}
},
methods:{
updateLogin(){
console.log(`update login`)
}
}
}
</script>
<style scoped>
</style>

  箭头函数要改为function的形式，如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<template>
</template>
<script>
export default{
data(){
return {
isLogin: false
}
},
watch:{
isLogin: function(newVal, oldVal) {
newVal && this.updateLogin()
}
},
methods:{
updateLogin(){
console.log(`update login`)
}
}
}
</script>
<style scoped>
</style>

    from:https://blog.csdn.net/liubangbo/article/details/115242420

龙生   07 Apr 2021
View Details

html直接引用vue和element-ui的方法

代码如下所示：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>
    <div id="app">
        <el-button round @click="visible = true">圆角按钮</el-button>
        <br>
        <el-dialog :visible.sync="visible" title="Hello world">
            <p>Try Element</p>
        </el-dialog>
        <br>
        <el-switch v-model="value1" active-text="按月付费" inactive-text="按年付费">
        </el-switch>
        <el-switch style="display: block" v-model="value2" active-color="#13ce66" inactive-color="#ff4949"
            active-text="按月付费" inactive-text="按年付费">
        </el-switch>
        <br>
        <el-time-picker is-range v-model="value1" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间"
            placeholder="选择时间范围">
        </el-time-picker>
        <el-time-picker is-range arrow-control v-model="value2" range-separator="至" start-placeholder="开始时间"
            end-placeholder="结束时间" placeholder="选择时间范围">
        </el-time-picker>
        <br>
        <el-progress type="circle" :percentage="0"></el-progress>
        <el-progress type="circle" :percentage="25"></el-progress>
        <el-progress type="circle" :percentage="100" status="success"></el-progress>
        <el-progress type="circle" :percentage="70" status="warning"></el-progress>
        <el-progress type="circle" :percentage="50" status="exception"></el-progress>
        <br>
        <el-row>
            <el-button icon="el-icon-search" circle></el-button>
            <el-button type="primary" icon="el-icon-edit" circle></el-button>
            <el-button type="success" icon="el-icon-check" circle></el-button>
            <el-button type="info" icon="el-icon-message" circle></el-button>
            <el-button type="warning" icon="el-icon-star-off" circle></el-button>
            <el-button type="danger" icon="el-icon-delete" circle></el-button>
        </el-row>
        <br>
        <el-steps :active="1" finish-status="success">
            <el-step title="已付款"></el-step>
            <el-step title="退款中"></el-step>
            <el-step title="已退款"></el-step>
            <el-step title="待结算"></el-step>
            <el-step title="已结算"></el-step>
        </el-steps>
    </div>
</body>
<script>
    new Vue({
        el: '#app',
        data: function () {
            return { visible: false }
        }
    })
</script>
</html>

效果如图： 总结 到此这篇关于html直接引用vue和element-ui的方法的文章就介绍到这了,更多相关html引用vue和element-ui内容请搜索脚本之家以前的文章或继续浏览下面的相关文章，希望大家以后多多支持脚本之家！   from:https://www.jb51.net/web/743299.html

龙生   24 Mar 2021
View Details
1 2 3 4

Copyright © 2025 Longsheng All rights reserved