使用vue脚手架创建Vue项目并引入bootstrap-vue

1.Module build failed: Error: ENOENT: no such file or directory, open '包路径圆枯茄\bootstrap-vue\node_modules\core-js\modules\es.array.iterator.js'

2.Error: ENOENT: no such file or directory, open 'D:\ahao\studyPath\bootstrap-vue\node_modules\lodash\lodash.js'

3.VUE中使用BootstrapVue图片b-img标败吵签路径显示不出图片问橘察题

新建 vue.config.js 安装 npm i vue-cli-plugin-bootstrap-vue 配置vue.config.js后重新执行npm run serve

1、检查npm版本，升级版本

2、创建vue项目

1、此桐打开vue项目中index.html，修改Responsive meta tag

2、运行梁扒桥命令安装bootstrap-vue

3、app.js文件添加引用

4、可以直接引用组件

1、安装element-ui

2、main.js中引入引用橡猛

3、使用组件

发现不能显示之后我使用了goole cdn上的地址引入bootstrap文迟运唯件，发现悄察可以正常显示。所以问题应该出现在引入文件这里。

ctrl+左键进入glyphyicon，发现实现的代码是这样的：

@font-face {

font-family: 'Glyphicons Halflings'

src: url('../fonts/glyphicons-halflings-regular.eot')

src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg')

}

.glyphicon {

position: relative

top: 1px

display: inline-block

font-family: 'Glyphicons Halflings'

font-style: normal

font-weight: normal

line-height: 1

-webkit-font-smoothing: antialiased

-moz-osx-font-smoothing: grayscale

}

在idea中就会发现@font-face这部分报红，提示can not resolve file glyphicons-halflings-regular.eot和glyphicons-halflings-regular.eot，意思是找不到文件。

所以码培glyphyicon这个样式，是关联着这些文件的，进入到下载的整个的压缩包，进入这个文件bootstrap-3.3.7-dist\fonts，就会发现如下文件：

，所以glyphyicon这个样式，必须要关联到glyphicons-halflings-regular.eot等文件才能正常使用。

---