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

Category Archives: Vue

ERROR in xxx.js from UglifyJs

ERROR in xxx.js from UglifyJs 问题 ERROR in app.bundle.js from UglifyJs Unexpected token: name «element», expected: punc «;» [app.bundle.js:106,8] 在用webpack对代码打包的时候报错，在网上找到了类似的答案，还是没有解决我的问题. 能解决大部分问题的链接 https://stackoverflow.com/questions/41254538/error-in-bundle-js-from-uglifyjs http://www.cnblogs.com/aredleave/p/7586911.html https://segmentfault.com/a/1190000011212544 按照以上方法对环境进行重新配置，依然报错！

1
2
3
4
ERROR in ./src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '@babel/core' babel-loader@8 requires Babel 7.x (the package '@babel/core').
If you'd like to use Babel 6.x ('babel-core'), you should install 'babel-loader@7'.

报错原因 通过代码报错原因是 babel-loader 版本问题，因为 babel-loader 用的最新的版本，和 UglifyJs 不兼容. 解决方法 通过运行下面代码对babel-loader进行重新安装（低版本）. npm install --save-dev babel-loader@7 通过修改后的package.json配置文件，亲测可以正确打包，无报错现象.

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
{
  "name": "kankan",
  "version": "1.0.0",
  "description": "kankan",
  "main": "webpack.config.js",
  "scripts": {
    "start": "webpack-dev-server --open --config webpack.dev.js",
    "build": "webpack --config webpack.prod.js"
  },
  "author": "kankan",
  "license": "ISC",
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-es2015": "^6.24.1",
    "clean-webpack-plugin": "^2.0.1",
    "css-loader": "^2.1.1",
    "express": "^4.16.4",
    "html-webpack-plugin": "^3.2.0",
    "style-loader": "^0.23.1",
    "uglifyjs-webpack-plugin": "^2.1.2",
    "webpack": "^4.30.0",
    "webpack-cli": "^3.3.1",
    "webpack-dev-middleware": "^3.6.2",
    "webpack-dev-server": "^3.3.1",
    "webpack-manifest-plugin": "^2.0.4",
    "webpack-merge": "^4.2.1"
  }
}

  奇卡奇卡 哈哈哈 个人主页：https://kankan.fun   from:https://blog.csdn.net/qq_38025939/article/details/89576282

龙生   27 Oct 2021
View Details

vue报错：Module build failed: TypeError: this.getOptions is not a function

vue-cli构建项目使用sass报错 Module build failed: TypeError: this.getOptions is not a function 出现问题的原因是安装的sass-loader版本过高,选择安装较低版本的sass-loader即可。

1
npm install sass-loader@7.3.1 --save-dev

  Module build failed: Error: Node Sass version 6.0.1 is incompatible with ^4.0.0. 出现问题的原因是安装的sass版本过高,选择安装4.0+版本的sass即可。

1
npm install node-sass@4.14.1 --save-dev

  from:https://www.cnblogs.com/chenjy1225/p/14930870.html

龙生   25 Oct 2021
View Details

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
1 2 3 4

Copyright © 2024 Longsheng All rights reserved