webpack项目中使用流程
1、初始化项目
npm init -y
2、安装webpack
cnpm install webpack webpack-cli -D
3、创建src文件夹 创建dist文件夹
4、创建webpack.config.js文件
5、在src中创建入口文件 main.js
6、初始打包
npx webpack
7、安装解析JS的babel文件
cnpm install --save-dev @babel/core babel-loader @babel/preset-env @babel/preset-react
8、安装解析CSS的loader文件
cnpm install --save-dev style-loader css-loader sass-loader node-sass
9、安装html插件
cnpm install -D html-webpack-plugin
10、安装处理图片的loader
cnpm install url-loader file-loader -D
11 、安装处理vue的文件loader
cnpm install -D vue-loader vue-template-compiler
12、安装vue.js
cnpm install vue -S
13、安装服务器环境
cnpm install webpack-dev-server -D //在package.json中修改为:'dev':'webpack-dev-server'
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 自定义通信协议——实现零拷贝文件传输
· Brainfly: 用 C# 类型系统构建 Brainfuck 编译器
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· DeepSeek 全面指南,95% 的人都不知道的9个技巧(建议收藏)
· 自定义Ollama安装路径
· 本地部署DeepSeek
· 快速入门 DeepSeek-R1 大模型
· DeepSeekV3+Roo Code,智能编码好助手