基础学习:
前端最基础的就是 HTML , CSS 和 JavaScript 。
网页设计:HTML和CSS基础知识的学习
HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
动态交互:JavaScript基础的学习
JavaScript是用来实现网页上的特效效果。如:鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻(新闻图片)的轮换。可以这么理解,有动画的,有交互的一般都是用JavaScript来实现的。
3、如果没有安装 webpack、webpack-cli 可以看顶部文章进行安装。
4、安装 webpack-dev-server
$ npm install webpack-dev-server --save-dev
5、安装完成之后,在当前目录创建一个 main.js 文件,里面随便写的内容:
console.log(‘dzm’);
6、之前文字我们是通过新建一个 webpack.config.js 来进行配置的,其实现在区分环境也差不多是同理,这里我记录两种方式
1)在 package.js 中添加 scripts 配置 serve 跟 build,然后两者分别对应不同的配置文件,配置里面可以单独针对编写配置,这种方式是通过不同配置文件直接进行打包:
“scripts”: {
“serve”: “webpack --config build/dev.js”,
“build”: “webpack --config build/pro.js”,
“test”: “echo “Error: no test specified” && exit 1”
},
dev.js 与 pro.js 里面也只需要一样的写不同配置,可以直接在两份文件中输出不同的打包文件名进行测试:
var config = {
// 入口文件
entry: {
main: ‘./main.js’
},
// 输出配置
output: {
// 输出得到的文件,文件名可以随意写
filename: ‘xyq.js’
}
};
文件效果:
2)在 package.js 中添加 scripts 配置 serve 跟 build,通过 webpack-dev-server 传入不同的参数进行区分,当然也可以像上面一样建两个文件进行区分:
“scripts”: {
“serve”: “webpack-dev-server --env development --config build/conf.js”,
“build”: “webpack-dev-server --env production --config build/conf.js”,
“test”: “echo “Error: no test specified” && exit 1”
},
然后我们新建在一个 conf.js 文件,可以在里面进行处理,我这边就用到了合并配置文件的操作,所以需要安装一下 webpack-merge
$ npm install webpack-merge --save-dev
conf.js 里面是这么判断使用的,我这边还是保持这 第一种方案的 配置文件区分方式,通过判断环境拿到不同配置文件的配置之后在与公用配置进行合并
// 开发配置
const devConfig = require(‘./dev’)
// 正式配置
const proConfig = require(‘./pro’)
最后
文章到这里就结束了,如果觉得对你有帮助可以点个赞哦
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
e(‘./pro’)
最后
文章到这里就结束了,如果觉得对你有帮助可以点个赞哦
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
[外链图片转存中…(img-G7MfrzVp-1715179513223)]