1.webpack 打包所有的资源
webpack.common.js 配置
const path = require("path");
const webpack = require("webpack");
.....
const appConfig = {
name: "app",
entry: {
//入口
},
context: path.resolve(__dirname, "src"),
output: {
//出口
},
resolve: {
//模块解析
},
externals: {
//不被打包 支持上下文
},
optimization: {
//优化代码
},
runtimeChunk: {
//提取重复文件
},
plugins: [
//插件
],
module: {
//模块
},
stats: "minimal"
}
//暴露模块
module.exports = appConfig;
webpack.config.js devServer
const path = require("path")
const fs = require("fs")
const merge = require("webpack-merge")
const commonConfig = require("./webpack.common")
module.exports = merge(commonConfig, {
mode: "development",
devServer: {
https: {
//dev-server 通过 HTTP 提供服务
},
proxy: {
//代理跨域
},
watchOptions: {
//与监视文件相关的控制选项
}
},
devtool: "cheap-module-source-map"
})
webpack.prod.js 打包项目时的配置文件
webpack.dll.config 性能优化
gulp 自动化构建工具增强工作流程
gulpfile.js gulp 任务
var gulp=require('gulp');
const fs=require('fs');
const path=require('path');
gulp.task('movelib',function(){
});
function getOptions(){}
function moveFolder(override){}
function moveFile(source,target,override){}
function copyFile(source,target,override=false){}
function mkdir(dir){}
src文件
components 组件
config 配置
lib 库
resource 资源
view 视图
ejs 官网参考
<%=
输出数据到模板(输出是转义 HTML 标签)
<%
‘脚本’ 标签,用于流程控制,无输出。
%>
一般结束标签
<title><%= htmlWebpackPlugin.options.title %></title>
<% htmlWebpackPlugin.options.scripts.forEach(function(script){%>
<script src="<%=script%>"></script>
<% }) %>
ES6 --类 详情参考
class Components {
constructor() {
this.init()
}
init() {
new OneMapGallery({
})
new PortalMapsGallery({
})
new FunctionGallery({
})
new OneMapGallery({
})
}
}
export default Components
登陆 class参考
import "./style.css"
import BaseApp from 'components/base/baseApp';
import axios from 'axios';
import 'bootstrap';
import ResourceGallery from './reource';
import Carousel from 'components/application-carousel/index';
// 跳转login组件
import * as login from 'components/login/login';
// 封装登陆验证
class App extends BaseApp {
constructor() {
super();
this.bind();
//获取登录信息
document.getElementById('link-onemap').href = config.onemapPage;
var geoCodingUrl = config.geocodingPage;
if (login.check()) {
geoCodingUrl = geoCodingUrl + '?token=' + login.token();
} else {
geoCodingUrl = config.loginPage;
}
document.getElementById('link-geocoding').href = geoCodingUrl;
this.initTypicalApplication();
this.initResourceCenter();
this.initNews();
}
initResourceCenter() { new ResourceGallery(); }
moveUpNewsList() { }
initNews() {
return axios.get(config.urls.news_mainpage).then((response) => {
if (response.data.code === 200) {
} else {
}
}).catch(function (error) {
})
}
updateNews() { }
initTypicalApplication() {
axios.get(config.urls.application_getall, {
}).then((result) => {
});
function bindControl(dataLength) { }
function animate(target, direction, distance) { }
return this;
}
bind() { }
}
new App();