Vue3报错:Module build failed (from ./node_modules/vue-loader/dist/index.js):TypeError:

文章主要讲述了在Vue项目中遇到的模块构建错误,问题源于在<scriptsetup>和<script>标签中重复导入了组件Message,导致TypeError:无法读取null的content属性。解决方法是删除或注释掉重复的导入语句。

报错:

Module build failed (from ./node_modules/vue-loader/dist/index.js):TypeError: Cannot read properties of null (reading 'content')

翻译:模块构建失败(from ./node_modules/vue-loader/dist/index.js):TypeError:无法读取null属性(读取'content')

 模组报错,多半因为重复声明组件报错,

解决方案:

<script setup >
import Message from '@/components/library/Message';
<script/>

<script >
import Message from '@/components/library/Message'; // 重复声明!!
<script/>

下载uuid报错Failed to compile with 5 errors 15:20:37 error in ./node_modules/uuid/dist/esm-browser/v35.js Module parse failed: Unexpected token (19:18) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | namespace = parse(namespace); | } > if (namespace?.length !== 16) { | throw TypeError(&#39;Namespace must be array-like (16 iterable integer values, 0-255)&#39;); | } @ ./node_modules/uuid/dist/esm-browser/v5.js 2:0-41 3:0-36 3:0-36 3:0-36 5:11-14 7:9-12 8:9-12 @ ./node_modules/uuid/dist/esm-browser/index.js @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue @ ./src/router/index.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.0.29:80&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js error in ./node_modules/uuid/dist/esm-browser/v6.js Module parse failed: Unexpected token (5:13) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | import v1ToV6 from &#39;./v1ToV6.js&#39;; | function v6(options, buf, offset) { > options ??= {}; | offset ??= 0; | let bytes = v1({ ...options, _v6: true }, new Uint8Array(16)); @ ./node_modules/uuid/dist/esm-browser/index.js 10:0-40 10:0-40 @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue @ ./src/router/index.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.0.29:80&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js error in ./node_modules/uuid/dist/esm-browser/v1.js Module parse failed: Unexpected token (6:25) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | function v1(options, buf, offset) { | let bytes; > const isV6 = options?._v6 ?? false; | if (options) { | const optionsKeys = Object.keys(options); @ ./node_modules/uuid/dist/esm-browser/index.js 5:0-40 5:0-40 @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue @ ./src/router/index.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.0.29:80&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js error in ./node_modules/uuid/dist/esm-browser/v7.js Module parse failed: Unexpected token (7:40) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | let bytes; | if (options) { > bytes = v7Bytes(options.random ?? options.rng?.() ?? rng(), options.msecs, options.seq, buf, offset); | } | else { @ ./node_modules/uuid/dist/esm-browser/index.js 12:0-40 12:0-40 @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue @ ./src/router/index.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.0.29:80&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js error in ./node_modules/uuid/dist/esm-browser/v4.js Module parse failed: Unexpected token (9:33) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | } | options = options || {}; > const rnds = options.random ?? options.rng?.() ?? rng(); | if (rnds.length < 16) { | throw new Error(&#39;Random bytes length must be >= 16&#39;); @ ./node_modules/uuid/dist/esm-browser/index.js 8:0-40 8:0-40 @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/components/singleDevice/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/components/layerComp/index.vue @ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue?vue&type=script&lang=js @ ./src/views/largeScreen/index.vue @ ./src/router/index.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://192.168.0.29:80&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
06-19
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值