增加html模块功能
This commit is contained in:
parent
d6e8f999ed
commit
00299a78cf
36
README.md
Normal file
36
README.md
Normal file
@ -0,0 +1,36 @@
|
||||
# cebg-site
|
||||
|
||||
|
||||
|
||||
使用webpack来发布静态页面
|
||||
|
||||
|
||||
|
||||
## webpack plugin
|
||||
|
||||
|
||||
|
||||
| plugin名 | 说明 |
|
||||
| ---------------------------------- | ---------------------------------------- |
|
||||
| html-webpack-plugin | |
|
||||
| mini-css-extract-plugin | |
|
||||
| optimize-css-assets-webpack-plugin | 用于压缩css, 替换webpack默认的功能 |
|
||||
| terser-webpack-plugin | 用于压缩生成的html,替换webpack默认的功能 |
|
||||
|
||||
|
||||
|
||||
## webpack loader
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
| loader名 | 说明 |
|
||||
| ------------------- | ---------------------------- |
|
||||
| css-loader | |
|
||||
| style-loader | |
|
||||
| file-loader | |
|
||||
| html-loader | |
|
||||
| url-loader | |
|
||||
| template-ejs-loader | 用于在页面中引入其他页面组件 |
|
||||
|
@ -12,20 +12,15 @@
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"copy-webpack-plugin": "^11.0.0",
|
||||
"css-loader": "^6.7.1",
|
||||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"file-loader": "^6.2.0",
|
||||
"glob": "^8.0.3",
|
||||
"html-loader": "^4.2.0",
|
||||
"html-webpack-plugin": "^5.5.0",
|
||||
"html-webpack-tags-plugin": "^3.0.2",
|
||||
"html-withimg-loader": "^0.1.16",
|
||||
"jsdom": "^20.0.0",
|
||||
"mini-css-extract-plugin": "^2.6.1",
|
||||
"optimize-css-assets-webpack-plugin": "^6.0.1",
|
||||
"raw-loader": "^4.0.2",
|
||||
"style-loader": "^3.3.1",
|
||||
"template-ejs-loader": "^0.9.4",
|
||||
"terser-webpack-plugin": "^5.3.6",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.74.0",
|
||||
|
46
src/comp/footer.html
Normal file
46
src/comp/footer.html
Normal file
@ -0,0 +1,46 @@
|
||||
<section class="join">
|
||||
<div class="join-inner">
|
||||
<a href="https://discord.gg/8dWX6jpcME">
|
||||
<img src="img/home/join1@2x.png" />
|
||||
</a>
|
||||
<a href="https://t.me/CEBG_official">
|
||||
<img src="img/home/join2@2x.png" />
|
||||
</a>
|
||||
<a href="https://twitter.com/CEBG_GAME">
|
||||
<img src="img/home/join3@2x.png" />
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
<section class="footer">
|
||||
<div class="footer-inner">
|
||||
<dl>
|
||||
<dt>Product</dt>
|
||||
<dd><a href="./index.html">Home</a></dd>
|
||||
<dd><a href="./gameplay.html">Gameplay</a></dd>
|
||||
<dd><a href="./tokenomic.html">Tokenomic</a></dd>
|
||||
<dd><a href="./nft.html">NFT</a></dd>
|
||||
<dd><a href="javascript:alert('Comeing soon')">Marketplace</a></dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>Resources</dt>
|
||||
<dd><a href="https://whitepaper.cebg.games/">Whitepaper</a></dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>About</dt>
|
||||
<dd><a href="./team.html">Team</a></dd>
|
||||
<dd><a href="./roadmap.html">Roadmap</a></dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>Policies</dt>
|
||||
<dd><a href="./terms.html">Terms of use</a></dd>
|
||||
<dd><a href="./privacy.html">Privacy Policy</a></dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>Contact us</dt>
|
||||
<dd><a href="mailto:contact@cebg.games">contact@ecbg.games</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="footer-bottom na-he">
|
||||
COPYRIGHT © CEBG.ALL RIGHTS RESERVED.
|
||||
</div>
|
||||
</section>
|
5
src/comp/jslib.html
Normal file
5
src/comp/jslib.html
Normal file
@ -0,0 +1,5 @@
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-2.2.4.min.js"
|
||||
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
30
src/comp/walletModal.html
Normal file
30
src/comp/walletModal.html
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
109
webpack.desktop.dev.js
Normal file
109
webpack.desktop.dev.js
Normal file
@ -0,0 +1,109 @@
|
||||
const path = require('path')
|
||||
const glob = require('glob')
|
||||
var webpack = require('webpack')
|
||||
const htmlWebpackPlugin = require('html-webpack-plugin')
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
||||
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin')
|
||||
const TerserPlugin = require('terser-webpack-plugin')
|
||||
|
||||
const entryFiles = glob.sync(path.join(__dirname, './src/desktop/*.html'))
|
||||
const htmlWebpackPlugins = []
|
||||
|
||||
// entryFiles.map((entryFile) => {
|
||||
// const matchRes = entryFile.match(/src\/desktop\/(.*)\.html$/)
|
||||
// const pageName = matchRes && matchRes[1]
|
||||
// console.log(pageName)
|
||||
// htmlWebpackPlugins.push(
|
||||
// new htmlWebpackPlugin({
|
||||
// template: path.join(__dirname, `./src/desktop/${pageName}.html`),
|
||||
// filename: `${pageName}.html`,
|
||||
// inject: 'body',
|
||||
// }),
|
||||
// )
|
||||
// })
|
||||
|
||||
module.exports = {
|
||||
mode: 'development',
|
||||
entry: './src/desktop/js/app.js',
|
||||
output: {
|
||||
path: path.resolve(__dirname, 'dist/desktop'),
|
||||
filename: 'js/[name]-[hash].js',
|
||||
publicPath: './',
|
||||
assetModuleFilename: 'img/[hash][ext][query]',
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.(png|jpg|gif|jpeg|svg)$/,
|
||||
// type: 'asset/resource',
|
||||
dependency: { not: ['url'] },
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
name: '[hash].[ext][query]',
|
||||
limit: 1024 * 10,
|
||||
outputPath: 'img',
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.(woff|ttf|svg|eot|ico)$/,
|
||||
use: ['url-loader'],
|
||||
},
|
||||
{
|
||||
test: /\.css$/i,
|
||||
use: [MiniCssExtractPlugin.loader, { loader: 'css-loader' }],
|
||||
},
|
||||
{
|
||||
test: /.html$/,
|
||||
use: [
|
||||
{
|
||||
loader: 'html-loader',
|
||||
options: {
|
||||
esModule: false,
|
||||
sources: {
|
||||
list: [
|
||||
'...',
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-bigimg',
|
||||
type: 'src',
|
||||
},
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-imgdetail',
|
||||
type: 'src',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
'template-ejs-loader',
|
||||
],
|
||||
},
|
||||
// {
|
||||
// exclude: /\.(css|js|html|json|less|png|jpg|gif|woff|ttf|svg|eot)$/,
|
||||
// loader: 'file-loader',
|
||||
// },
|
||||
],
|
||||
},
|
||||
plugins: [
|
||||
new htmlWebpackPlugin({
|
||||
template: path.join(__dirname, `./src/desktop/index1.html`),
|
||||
filename: `index.html`,
|
||||
inject: 'body',
|
||||
}),
|
||||
new MiniCssExtractPlugin(),
|
||||
].concat(htmlWebpackPlugins),
|
||||
optimization: {
|
||||
splitChunks: {
|
||||
chunks: 'all',
|
||||
},
|
||||
minimize: true,
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
extractComments: false,
|
||||
}),
|
||||
new OptimizeCssAssetsPlugin(),
|
||||
],
|
||||
},
|
||||
}
|
@ -55,30 +55,31 @@ module.exports = {
|
||||
},
|
||||
{
|
||||
test: /.html$/,
|
||||
loader: 'html-loader',
|
||||
options: {
|
||||
esModule: false,
|
||||
sources: {
|
||||
list: [
|
||||
'...',
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-bigimg',
|
||||
type: 'src',
|
||||
use: [
|
||||
{
|
||||
loader: 'html-loader',
|
||||
options: {
|
||||
esModule: false,
|
||||
sources: {
|
||||
list: [
|
||||
'...',
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-bigimg',
|
||||
type: 'src',
|
||||
},
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-imgdetail',
|
||||
type: 'src',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-imgdetail',
|
||||
type: 'src',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
'template-ejs-loader',
|
||||
],
|
||||
},
|
||||
// {
|
||||
// exclude: /\.(css|js|html|json|less|png|jpg|gif|woff|ttf|svg|eot)$/,
|
||||
// loader: 'file-loader',
|
||||
// },
|
||||
],
|
||||
},
|
||||
plugins: [new MiniCssExtractPlugin()].concat(htmlWebpackPlugins),
|
||||
|
@ -56,30 +56,31 @@ module.exports = {
|
||||
},
|
||||
{
|
||||
test: /.html$/,
|
||||
loader: 'html-loader',
|
||||
options: {
|
||||
esModule: false,
|
||||
sources: {
|
||||
list: [
|
||||
'...',
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-bigimg',
|
||||
type: 'src',
|
||||
use: [
|
||||
{
|
||||
loader: 'html-loader',
|
||||
options: {
|
||||
esModule: false,
|
||||
sources: {
|
||||
list: [
|
||||
'...',
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-bigimg',
|
||||
type: 'src',
|
||||
},
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-imgdetail',
|
||||
type: 'src',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
tag: 'a',
|
||||
attribute: 'data-imgdetail',
|
||||
type: 'src',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
'template-ejs-loader',
|
||||
],
|
||||
},
|
||||
// {
|
||||
// exclude: /\.(css|js|html|json|less|png|jpg|gif|woff|ttf|svg|eot)$/,
|
||||
// loader: 'file-loader',
|
||||
// },
|
||||
],
|
||||
},
|
||||
plugins: [new MiniCssExtractPlugin()].concat(htmlWebpackPlugins),
|
||||
|
Loading…
x
Reference in New Issue
Block a user