# singlePage-tpl

**Repository Path**: wangyuda2017/singlePage-tpl

## Basic Information

- **Project Name**: singlePage-tpl
- **Description**: 单页面webpack版，只是开发单个页面而不是单页面应用，单页面应用还是用vue-cli构建吧！
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-03-28
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 构建单页面模板

  一、功能：
      1. 自动添加浏览器前缀
      2. 可以使用scss
      3. babel支持es2015, async, await



  二、配置：
  ``` bash
    1. singlePage-tpl> index.html
       这个是模板文件，可以修改title，meta等

    2. singlePage-tpl> webpack.base.config
      这个是webpack基本配置
      1. 修改入口文件位置
      entry: {
        app: './src/pages/quoted/index.js'
      }
      2. 修改输出位置
        path: path.resolve(__dirname, 'dist', 'quoted')
      3. 修改静态文件复制位置（选填）
          new CopyWebpackPlugin([
            {
              from: path.resolve(__dirname, './src/pages/quoted/images'),
              to: path.resolve(__dirname, './dist/quoted/images'),
              ignore: ['.*']
            }
          ])
      4. 修改webpack.dev.config，开发服务器，输出文件位置
        devServer: {
          contentBase: './dist/quoted',
          hot: true
        }

      6. Babel默认只转换新的JavaScript句法（syntax），而不转换新的API，比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象，以及一些定义在全局对象上的方法（比如Object.assign）都不会转码。

      如需要转码： 请在脚本头部自行引入： import 'babel-polyfill';


  三、使用
      src > pages > yourPage
      1. 渲染引擎是handlerbars
      2. css or scss
      3. $是全局的不需要引入，直接使用即可

  ```