webpack4编译vue样式时错误

最新推荐文章于 2025-02-20 07:30:10 发布

原创

最新推荐文章于 2025-02-20 07:30:10 发布 · 461 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#webpack #前端

在升级脚手架后，vue样式编译出现警告。错误源于为解决背景图片输出问题修改的webpack配置。经过研究，发现开启的esModule参数与webpack4的tree shaking冲突，导致vue2样式编译错误。解决方案是调整webpack配置中的esModule设置，以兼容vue2的样式编译。

最近升级了脚手架的编译层的代码，vue同学反馈过来说编译样式出现警告，记录下问题及解决方法

错误信息

WARNING in ../vueSample/js/index/_pages/app.vue?vue&type=style&index=0&lang=stylus& 1:469-472
"export 'default' (imported as 'mod') was not found in '-!../../../..

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

kkndyyrolf

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

webpack5 + vue3 从零配置项目

weixin_43822185的博客

11-10

1237

webpack5 + vue3 从零配置项目

webpack4+vue.rar

04-21

Webpack 4 和 Vue.js 结合使用是现代前端开发中的常见实践，这可以帮助开发者高效地管理和构建复杂的前端项目。本案例提供了使用 Vue.js 和 Webpack 4 搭建项目的完整流程，包括 PostCSS、Babel 和 SCSS 的配置。...

1 条评论您还未登录，请先登录后发表或查看评论

webpack+Vue引入css报错

遇见一个人流泪的博客

04-23

9791

Refused to apply style from 'http://localhost:9000/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled. 原因：路径不对

webpack打包不识别es6语法的坑

qq_39447467的博客

08-22

4693

webpack打包不识别es6语法的坑今天Vue项目npm run build 后webpack，报错uglifyjs，自己研究了一下，翻译过来，意思是不识别项目中写的高级语法，这里要把项目里es6语法转es5让浏览器识别，也就是webpack的babel需要配置下 Babel其实是一个编译JavaScript的平台，它的强大之处表现在可以通...

解决编辑器无法识别webpack别名路径

chendf__的博客

04-20

1036

解决在vue项目中，编辑器无法识别别名，导致没有路径提示，也无法通过路径点击进去改文件中 jsconfig.json配置文档在项目根目录中添加 jsconfig.jsong 文件 touch jsconfig.json 配置 jsconfig.json 文件 { "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"], "@utils/*": ["src/utils/*"],

“export ‘default‘ (imported as ‘xxx‘) was not found in ‘xxx‘解决办法

YukiGreen的博客

07-13

2万+

"export 'default' (imported as 'xxx') was not found in 'xxx'解决办法

在vue中报export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue 解决办法

热门推荐

qq_45680037的博客

03-31

4万+

在vue中报export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue 问题原因今天在学习vue的过程中遇到一个这样的问题，在利用事件总线的时候出现上图的错误，经过百度，最终找到问题的原因就是版本的问题，我是安装了最新的vuecli，版本大概是4.5.4，我最开始安装vuecli没有指定版本 cli4中main.js中引用文件是下图 import {createApp} from 'vue’的格式引用的而cli3中是用import Vue

浅谈webpack编译vue项目生成的代码探索

08-28

在深入理解 Webpack 编译 Vue 项目生成的代码时，我们需要关注以下几个方面： - **Vue 模板的编译**：Vue 的模板会被转换为渲染函数，这是一个 JavaScript 函数，用于生成虚拟 DOM。 - **静态资源处理**：图片、...

精选资源

webpack5vue2

02-25

在结合 Webpack 5 进行项目构建时，我们可以利用 Webpack 的强大功能优化 Vue 应用的构建流程。 1. **升级至 Webpack 5**：Webpack 5 引入了许多改进，包括更快的编译速度、更好的内存管理和对原生 ESM（ES 模块）...

webpack打包文件，import导入报export ‘default‘ (imported as.... was not found in ‘....filename.js‘

sjz20072304的博客

04-15

844

webpack打包文件，import导入报export 'default' (imported as.... was not found in '....filename.js'

webassembly学习

u012477435的博客

01-07

2435

解决webpack4 import 动态导入组件打包报错

最新发布

fangcaojushi的博客

02-20

964

google一下得知，webpack4不支持import动态加载，建议使用babel-plugin-dynamic-import-webpack来解决…从代码报错位置来看，代码中使用了动态import加载组件，大体的方向定位了，后面就好办了。

webpack4

机智的皮卡丘的博客

02-28

9733

还好前面写webpack3.x稍微赶上了点热度,最近在准备重构,还在考虑要不要使用parcel,正好发布了webpack4.0.0，就研究了下,修改还是比较大的。包含了大量的特性更新, 以及极大的性能优化(最高可达 98%)Webpack 4 中移除了 CommonsChunkPlugin, 替换以一系列默认的配置以及简单的 optimize.splitChunks 接口同时 Webpack 4 ...

Rust and WebAssembly -- 从hello world开始

一个新时代的好少年的博客

11-20

762

rust wasm 的一个hello world 式例子

export * as name1 from …； webpack4报错

weixin_40829615的博客

06-05

627

在 Webpack 5 之前，Webpack 对 export * as name1 from …这种导出语法不支持，导致报错。

export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue‘解决

qq_64353584的博客

04-20

1万+

webpack在打包Vue是出现imported as Vue was not found in Vue问题的解决

运行vue项目：警告提示 “export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue‘

iijik55的博客

03-10

1万+

问题：运行vue项目时，警告提示"export ‘default’ (imported as ‘Vue’) was not found in ‘vue’ 在main.js中在路由文件下的index.js中原因：安装的vue-cli为v4以上的版本，其不包含全局的 Vue，Vue 被 createApp函数代替解决方案：在main.js中 import { createApp } from 'vue' // 代替 import Vue from 'vue' import App from '.

webstorm vuejs 警告“default export is not declared in imported module”

今天

08-09

1万+

首先启用webstorm es6语法 eslint –init 执行自定义的语法检查警告“default export is not declared in imported module“， Editor->Inspections->Javascript->Genernal 取消打勾“unresolved javascript fucntions“ 取消打勾：“unresolved

Webpack编译Vue项目：代码生成深度解析

当Webpack编译Vue项目时，它会执行以下步骤： 1. **模块解析**: Webpack遍历项目的源代码，识别并打包所有的模块，包括Vue组件、样式文件（如CSS）、图片资源等。 2. **模块打包**: 对于每个模块，Webpack会根据...