首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Vue加载程序17.0.0 + Webpack 5.74.0 -模块构建失败

Vue加载程序17.0.0 + Webpack 5.74.0 -模块构建失败
EN

Stack Overflow用户
提问于 2022-10-18 18:39:02
回答 1查看 156关注 0票数 1

我正在尝试使用VUE -加载程序我的SPA VUE应用程序,我得到以下错误。

代码语言:javascript
复制
ERROR in ./app2.vue
Module build failed (from ./node_modules/vue-loader/dist/index.js):
TypeError: Cannot read properties of undefined (reading 'styles')
    at Object.loader (/Users/daniel.bachnov/docker/qhs3-admin/frontend/node_modules/vue-loader/dist/index.js:70:34)
 @ ./main.js 1:0-29 14:8-11

webpack 5.74.0 compiled with 1 error and 3 warnings in 3312 ms

为了消除应用程序代码噪声,我创建了非常简单的组件app2.vue:并尝试将其连接到我的main.js入口点文件。

代码语言:javascript
复制
<script>
export default {
  data() {
    return {
      count: 0
    }
  }
}
</script>

<template>
  <button @click="count++">You clicked me {{ count }} times.</button>
</template>

main.js

代码语言:javascript
复制
import App from './app2.vue';
import Router from './router/router.js';
import Store from './store/index.js';

Vue.use(Vuetify)
Vue.use(VueRouter);

const app = new Vue({
    router: Router.router,
    store: Store,
    el: '#app',
    vuetify: new Vuetify(),
    components: {
        App,
    }
});

webpack.config.js:

代码语言:javascript
复制
const path = require('path');
const { VueLoaderPlugin } = require('vue-loader')

module.exports = {
    mode: 'production',
    entry: './main.js',
    output: {
        filename: '[name].bundle.js',
        path: path.resolve(__dirname, './../src/public/dist/'),
        publicPath: "/dist/"
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            }
        ]
    },
    plugins: [
        // make sure to include the plugin!
        new VueLoaderPlugin()
    ]
};

package.json

代码语言:javascript
复制
{
  "name": "app",
  "version": "1.0.0",
  "description": "app",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "watch": "webpack --watch",
    "build": "webpack"
  },
  "author": "daniel bach",
  "license": "ISC",
  "dependencies": {
    "@mdi/js": "^5.9.55",
    "@vue/composition-api": "1.0.4",
    "@vuetify/cli-plugin-utils": "^0.0.9",
    "apexcharts": "^3.27.3",
    "core-js": "^3.6.5",
    "vue": "^2.6.11",
    "vue-apexcharts": "^1.6.2",
    "vue-router": "^3.2.0",
    "vuetify": "^2.4.0",
    "vuex": "^3.4.0",
    "vue-loader": "^17.0.0"
  },
  "devDependencies": {
    "vue-loader": "^17.0.0",
    "vue-template-compiler": "^2.7.13",
    "webpack": "^5.74.0",
    "webpack-cli": "^4.10.0"
  },
  "keywords": []
}

你知道我为什么老是犯这个错误吗?

EN

回答 1

Stack Overflow用户

发布于 2022-10-18 20:23:34

我遇到了一个类似的问题,once.Try重新安装webpack npm install webpack@5.74.0 --save。应该管用的。但是,如果没有,尝试将版本降低一点。

还应努力:

package-lock.json

  • run

  • 删除node_modules文件夹和npm install
票数 -1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/74115950

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档