vue中使用element-ui自定义主题后,vue-cli跑不起来了
环境:vue-cli 2.x版本
自己在官网配置了主题并放到了项目中https://element.eleme.cn/#/zh-CN/theme
然后,我的脚手架在我的电脑中休息了几天,就跑不通了呢!

可以看到报错:
: config.dev.cssSourceMap
^
TypeError: Cannot read property 'cssSourceMap' of undefined
原因:
我在项目下放了一个config.json文件,他是element-ui的自定义主题配置文件。

仔细观察我的报错:
在项目build目录下的vue-loader.conf.js文件中,config.dev是undefined,所以才会报错说“不能读undefined的属性”。因为undefined类型是没有属性的,这点是js的基础知识。

好,那就说明config变量(可能是个对象)他没有dev属性。
于是我去这个文件夹下打印config变量:

他原本引得路径是本文件上一级目录的config。
可能因为require这个node语法的特点,虽然我还没学到,但是我猜测require里边的路径,如果不写后缀名,会自动补全后缀名,
也就是说如果有同名文件就会被引入。如果没有同名文件,他就引入同名文件夹下的index.js

但是我现在在build上一级中(根目录下)放了config.json。他优先引入了config.json文件。
打印结果证实了我的猜测:下边的对象就是config.json里边的代码

解决
于是我把require里边的引入路径修改一下,把config的路径添加为“.../config/index”:

再打印,这里就没问题了,内容就是config文件夹中的index.js的内容:

但是又来了新问题,换了新的页面webpack.base.conf.js:19

path: config.build.assetsRoot,
^
TypeError: Cannot read property 'assetsRoot' of undefined
看来这个里边也是引入的路径的问题。去对应文件的对应行19行寻找问题位置:

果然这里也是因为config.json文件的加入,导致config引入进来的不对了:

修改这里的路径,顺便把webpack的其他配置文件中config/index.js的引入也修改一下:

以下三个文件中都有同样的问题:

还有utils里边也用到了。也得改。
综上,一下五个文件中,关于config文件中index.js的引入路径都需要改一下就可以正常跑起来了。

为了看到这两行,真不容易啊!

vue中使用element-ui自定义主题后,vue-cli跑不起来了的更多相关文章
- 在vue中关于element UI 中表格实现下载功能,表头添加按钮,和点击事件失效的解决办法。
因为在element 中表格是使用el-table的形式通过数据来支撑结构,所以,表格的样式没有自己写的灵活,所以有了没法添加按钮的烦恼.下面是解决的方法. 准备工作: 一.下载npm安装包两个 1. ...
- vue中修改Element ui样式不起作用
公司做的一个后台系统,由于Elemen ui是响应式的,在小屏笔记本中,一行两列的表单会自动变成一行一列,这样就很不美观了,由于是后台系统,当时也没考虑适配问题. 老总 地表最强的电脑 运行了一下,当 ...
- element ui 自定义主题失败(primordials is not defined)
卸载: 1.卸载cnpm npm uninstall cnpm -g 2.卸载vue-cli npm uninstall @vue/cli -g 3.卸载nodejs和删除文件 C:\Program ...
- 在vue中使用Element的message组件
在vue中使用Element的message组件 在vue文件中使用 this.$message({ message: "提示信息", type: "success&qu ...
- FastAPI实践项目:SayHello(FastAPI + vue.js + axios + element ui)
目录 简介 翻版 VS 本尊 后端服务 源码 接下来 简介 这次带来的是FastAPI + vue.js + axios + element ui (一个html文件里使用的) 实现的<Flas ...
- Vue基础01vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令
自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...
- Vue之vue中的data为什么是一个函数+vue中路径别名alias设置
问题描述 为什么在vue组件中,我们的data属性必须是一个函数,new Vue()中的data除外,因为new Vue中只有一个data属性. 原因 因为我们能抽离出来的组件,肯定是具有复用性的,它 ...
- vue中使用Element主题自定义肤色
一.搭建好项目的环境. 二.根据ElementUI官网的自定义主题(http://element.eleme.io/#/zh-CN/component/custom-theme)来安装[主题生成工具] ...
- 如何在 Vite 中使用 Element UI + Vue 3
在上篇文章<2021新年 Vue3.0 + Element UI 尝鲜小记>里,我们尝试使用了 Vue CLI 创建 Vue 3 + Element UI 的项目,而 Vue CLI 实际 ...
随机推荐
- 基础知识---IEnumerable、ICollection、IList、IQueryable
一.定义 IEnumerable public interface IEnumerable<out T> : IEnumerable ICollection public interfac ...
- JavaScript 加减危机——为什么会出现这样的结果?
在日常工作计算中,我们如履薄冰,但是 JavaScript 总能给我们这样那样的 surprise~ 0.1 + 0.2 = ? 1 - 0.9 = ? 如果小伙伴给出内心的结果: 0.1 + 0.2 ...
- C#利用newtonsoft.json读取.so配置文件内容
今天花 了点时间来使用 C#读取json文件 ,文件后缀为 .so文件 ,也是基于文件流的形式 获取 对象 ,然后解析; 之所以尝试 使用 json读取 ,是因为其配置文件的格式 更为友好 和方便,直 ...
- Java线程安全面试题,你真的了解吗?
多个线程不管以何种方式访问某个类,并且在主调代码中不需要进行同步,都能表现正确的行为. 线程安全有以下几种实现方式: 不可变 不可变(Immutable)的对象一定是线程安全的,不需要再采取任何的线程 ...
- 洛谷P1523 旅行商简化版(DP)
题目: P1523 旅行商简化版 解析 可以看做是两个人同时从西往东走,经过不一样的点,走到最东头的方案数 设\(f[i][j]\)表示一个人走到i,一个人走到j的最短距离(\(i<j\)) 第 ...
- vue项目进入mui.js报错 typeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode .....
在做项目时,引用mui报错如下 看样子就是不支持严格模式吧. 解决方法是在根目录 下的.babelrc文件里面添加过滤掉.不用严格模式
- uni-app通过判断接口403跳转登录页面的问题
需求: 当向后端请求接口返回 403 的时候,直接跳到登录页面让用户登录 实现方案: 在请求结束后拦截器中判断,如果是 403 就跳转 遇到难题: 一级页面(我的) onShow() 中有接口请求,用 ...
- 配置WDA程序到NWBC
NWBC是通过角色来做的权限管理,包括菜单项. 如果用户没有分配对应的,登陆后看到的东西很少,或者空白. 这里需要先将BC的个性化参数全部配齐,方便使用.BC最左上角,点击,设置,个性化设置. 如下几 ...
- java-log4j配置
引入依赖: <dependency> <groupId>log4j</groupId> <artifactId>log4j</artifactId ...
- LDA-作为线性判别 降维 推导
LDA 降维原理 前面对 LDA 作为作为分类器 有详细推导, 其核心就是 贝叶斯公式, 已知全概率, 求(条件概率)最大先验概率, 类似的问题. 而 LDA 如果作为 降维 的原理是: a. 将带上 ...