vue-cli中如何创建并引入自定义组件
vue-cli中如何创建并引入自定义组件1.在components(专门放组件的文件)下创建一个header.vue文件2.在App.vue文件里添加如下代码 <my-head></my-head> import myHead from './components/header' components : { myHead,
·
vue-cli中如何创建并引入自定义组件
1.在components(专门放组件的文件)下创建一个header.vue文件
2.在App.vue文件里添加如下代码
myHead,
如果 import myHead from './components/header' 去掉前面的 ./ 就会报如下错误:
Failed to compile.
./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0&bustCache!./src/App.vue Module not found: Error: Can't resolve 'components/header' in 'E:\工作\src' @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0&bustCache!./src/App.vue 11:0-39 @ ./src/App.vue @ ./src/main.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js
1.在components(专门放组件的文件)下创建一个header.vue文件
2.在App.vue文件里添加如下代码
<my-head></my-head>
import myHead from './components/header'
myHead,
}
由于vue-cli内部配置的原因,@等同于src,因此可以写成
@/components/header
此时header.vue组件就会被成功引入如果 import myHead from './components/header' 去掉前面的 ./ 就会报如下错误:
Failed to compile.
./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0&bustCache!./src/App.vue Module not found: Error: Can't resolve 'components/header' in 'E:\工作\src' @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0&bustCache!./src/App.vue 11:0-39 @ ./src/App.vue @ ./src/main.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js
更多推荐
已为社区贡献3条内容
所有评论(0)