解决vue项目中引入组件时出现的Module is not installed问题

如图，在vue项目中import自己定义的组件时，‘@api/table’出现下划线，ctrl+右键点击不会跳转到对应组件。鼠标移上去显示Module is not installed，多方查询后终于弄清楚了原因。

图中路径中有个@符号，这个符号是在build目录下的webpack.base.conf.js文件中定义的，代表当前项目的src目录。

之所以出现上述问题是因为在下图中的webpack中没有指定webpack 的配置文件，或者配置文件指定得不对。找到原因后解决方案就简单了，只需要将该配置文件路径正确配置即可，由于是开发环境，因此配置文件选择webpack.dev.conf.js，至此问题解决。

原文地址：https://www.cnblogs.com/wangxiaoqian/p/12391362.html

时间： 2024-08-24 17:58:13

解决vue项目中引入组件时出现的Module is not installed问题的相关文章

vue项目中引入Sass

Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g,安装vue-cli脚手架,若是已经安装了,则不必再次安装,直接 跳过这一步.接下来执行命令行vue init webpack mypro(注:mypro是项目名). 接下来安装Sass依赖包,使用以下命令行: npm install sass-loader --save-dev npm instal

如何在vue项目中引入element ui组件

(1)安装element ui,即: npm i element-ui -S 然后在项目中的node_modules目录下查看是否有element-ui文件夹,如果有说明安装成功了: (2)引入element ui 在main.js中引入element ui,即: 1 import ElementUI from 'element-ui' 2 import 'element-ui/lib/theme-chalk/index.css' 3 Vue.use(ElementUI) [注意红色部分,以前是

在 Vue 项目中引入 tinymce 富文本编辑器

项目中原本使用的富文本编辑器是 wangEditor,这是一个很轻量.简洁编辑器 但是公司的业务升级,想要一个功能更全面的编辑器,我找了好久,目前常见的编辑器有这些: UEditor:百度前端的开源项目,功能强大,基于 jQuery,但已经没有再维护,而且限定了后端代码,修改起来比较费劲 bootstrap-wysiwyg:微型,易用,小而美,只是 Bootstrap + jQuery... kindEditor:功能强大,代码简洁,需要配置后台,而且好久没见更新了 wangEditor:轻量.

vue项目中引入elementUI

1.安装淘宝npm镜像 输入命令:npm install -g cnpm --registry=https://registry.npm.taobao.org 2.安装全局vue-cli脚手架 cnpm install --global vue-cli 3.初始化一个vue项目 vue init webpack itemname 4.安装 elementUI npm i element-ui -S快捷键ctrl+c,终止批处理操 作吗(Y/N),在输入命令npm i element-ui -S

vue项目中引入tinymce4

上个项目用没记录,这次捣鼓了半天,赶紧拿小本本记下来~ ps:只实现了基本功能,图片上传有点问题,还得捣鼓捣鼓,捣鼓出来了再更新~ 安装: npm install @tinymce/tinymce-vue -S npm install tinymce -S 安装之后,在 node_modules 中找到 tinymce/skins目录,然后将 skins 目录拷贝到 static 目录下,下载zh_CN.js文件也放在static/tinymce/下 修改index.html文件: <!DOCT

Vue项目中遇到的一些问题总结

一.开发环境使用Ajax请求,报错 网上查的资料,在config中的index.js这样设置 proxyTable:{ '/api':{ target:'', //此处为你的API接口地址 changeOrigin:true, pathRewrite:{ '^/api':'' //这里理解为用api代替target中的地址 } } } 配置完后,请求依然报错,大致是https证书的问题 [HPM] Error occured while trying to proxy request /xxx/

【vue】如何在 Vue-cli 创建的项目中引入 iView

根据vue项目的搭建教程,以下记录如何在Vue-cli创建的项目中引入iView. 1)iView的安装,在项目下使用 npm 安装iView cnpm install  iview  --save 2)在 webpack 入口页面 main.js   (E:\managerSys\manager-sys\src\main.js)中 添加 如下配置: import iView from 'iview'; // 导入组件库import 'iview/dist/styles/iview.css';

【vue】如何在 Vue-cli 创建的项目中引入iView

根据vue项目的搭建教程,一下记录下如何在Vue-cli创建的项目中引入iView. 1)安装iView,在项目下 cnpm install  iview  --save 2 ) 在 webpack 入口页面 main.js (E:\managerSys\manager-sys\src\main.js)中配置 import iView from 'iview'; // 导入组件库import 'iview/dist/styles/iview.css'; // 导入样式 Vue.use(iView

[记录]解决vue项目当直接通过url访问中间页时nginx返回404的问题

应用为VUE单页应用,路由模式为history,web服务器为nginx,正常情况下如果直接通过url访问一个中间页(不是index.html)时,会看到nginx返回的404错误,这个问题目前我只能通过修改nginx站点配置文件来实现. 具体代码(只看红色加粗的部分就行): server { listen 80; server_name ……; index index.php index.html index.htm default.php default.htm default.html;