Question

（免责声明：我不太精通Vue）

在我的项目中导入/包含Vuejs软件包的正确方法是什么？我似乎无法导入文件。我正在尝试导入此软件包：https://github.com/sagalbot/vue-select

到目前为止我所做的：

运行命令：npm install vue-select

尝试将vue-select包添加到我的Vue中，如下所示（在资源/资产/js/app.js）：

import vSelect from './components/Select.vue'
Vue.component('v-select', vSelect);

现在，当我在HTML文件中使用v-select时，它将在控制台中显示此错误：[Vue warn]: Unknown custom element: <v-select> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

我试图解决的问题：

我没有在app.js中使用它，而是在我的* .vue文件中使用了它，而是使用了webpack / browserify，所以导入不起作用：/我不想使用browserify。

我也有vue-resource包，它在我的public / js目录中创建了一个vue-resource.js文件，我可以导入该文件以使用vue-resource。似乎vue-select不会创建自己的vue-select.js文件。

如果您有任何建议，请告诉我。

我已经看过这个问题：Import vue package in laravel，但我不知道应将行添加到哪些路径和文件。

Answer 1

我认为这是您的import声明。如果已通过npm安装，则应从vue-select导入。另外，使用require代替import，这样：

Vue.component('v-select', require('vue-select'));

您可能只想在Vue组件中使用它，然后应按上述说明加载自己的组件，然后在自己的vue组件中说VueSelect.vue，请使用此命令：

<template>
    <!-- use it with name 'v-select' in your component -->
    <v-select></v-select>
</template>
<script>
export default {
    ...
    components: { vSelect: require('vue-select') },
    ...
}
</script>

然后您可以将自己的组件注册为全局

Vue.component('vue-select', require( './components/VueSelect.vue') );

并在您的根组件中使用它：

<vue-select></vue-select>

更新

如果您使用的是laravel，它使您可以立即使用laravel混合功能，从而可以使用webpack编译您的资产。您所需要做的就是运行一个编译脚本：

npm run dev

如果您要更改js文件，则不想一遍又一遍地运行它，因此可以运行watch命令：

npm run watch

如果这对您不起作用，请尝试使用watch-poll。好的，请确保先安装所有依赖项：

npm install

Laravel如何导入通过NPM安装的vuejs软件包

1 个答案: