webpack 怎么配置公共的header.html 和 footer.html

weixin_41248357 2018-06-27 05:44:08

<% include ./templates/footer.html %>
${require('./templates/footer.html')}

...全文

617 2 打赏收藏转发到动态举报

写回复

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

黄金清纯小王子 2018-06-28

打赏
举报

回复

新建两个.vue的组件，然后再需要人页面引入，注册，就行了

___紫菜 2018-06-28

打赏
举报

回复

用的vue



import Vue from 'vue'

import Head from '../components/IndexHead.vue'

new Vue({

    el: '#head',

    render: h => h(Head)

})

其他页面用<div id="head"></div>直接使用

若有想要学 Webpack 的，真的很值得下载这个资源：其一、包括初始化安装 webpack 工具；其二、安装 Vue 并挂载实例，浏览器能打开 index.html 文件; 其三、webpack 基本配置，成功打包 .js 文件；其四、Webpack 使用 vue-loader 打包 vue 文件，浏览器成功打开 .js 和 .vue 文件; 其五、其它 loader的用法(如：打包图片、打包 CSS 文件、打包 stylus 文件); 其六、使用 html-webpack-plugin、clean-webpack-plugin 插件、 autoprefixer 插件；其七、使用 devServer 配置、使用模块热替换、使用 SourceMap 配置；其八、将环境分成开发环境、生成环境、公共部分; 其九、使用 babel 将 ES6 编译成 ES5 的语法(即：兼容 ES6 的语法)；其十、TodoList 项目组件拆分与设计项目的目录结构；其十一、实现 MainHeader 组件、核心 MainTodo 组件、MainFooter 组件，明确需求与业务逻辑及项目小结

html、css、javascript、ajax、weex、vue.js、less、webpack等前端学习基础知识.zip

用于html和支持的webpack插件包括

1、本文章是建立在《windows下vue-cli及webpack 构建网站(一)环境安装》和《windows下vue-cli及webpack 构建网站(一)导入bootstrap样式》两篇文章之上的。 2、在src\components文件夹下面新建两个组件，分别为 header.vue、footer.vue，打开header.vue文件粘贴下面的代码作为网站的头部。