Question

嗨，我创建了一个名为Test.vue的小组件（使用vue-lodash作为依赖项），并像我一样使用npm pack创建了项目（test-project）的压缩包想要在将其发布到NPM之前在本地测试该软件包。然后，我有第二个项目（hello-world-project），在其中我安装了压缩包（test-project-1.0.0.tgz）以package.json的罚款出现。然后，我将Test.vue组件导入到我的HelloWorld.vue组件中，但是出现以下错误[Vue warn]: Error in render: "TypeError: Cannot read property 'upperCase' of undefined"

我如何解决这个问题？

我尝试了各种在线解决方案，但没有任何效果。

测试项目-App.vue

import Vue from 'vue'
import VueLodash from 'vue-lodash'

Vue.use(VueLodash, { name: 'lodash' })

import App from './App.vue'

new Vue({
  render: h => h(App)
}).$mount('#app')

测试项目-Test.vue

<template>
  <div>{{ test }}</div>
</template>

<script>
  export default {
    name: 'Test',
    props: {
      text: String
    },
    computed: {
        test() {
            return this.lodash.upperCase(this.text)  
        }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>

hello-world-project-HelloWorld.vue

<template>
  <div>
    <h1>Hello World</h1>

    <Test text="this is a test string" />
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import Test from "../../node_modules/test-project/src/components/Test.vue";

@Component({
    components: { Test }
})
export default class HelloWorld extends Vue {

}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

</style>

我希望Test.vue组件以大写字母显示输入文本。

我已经从tarball包中导入了Vue组件，但是却收到有关该组件中使用的依赖项的错误？

0 个答案: