随笔分类 -  webpack

Vue报错Cannot find module 'webpack/bin/config-yargs'
摘要：原因是webpack-dev-server和webpack的版本不匹配 进入package.json查看一下webpack和webpack-dev-server的版本号 解决方法 1、首先运行 npm uninstall webpack-dev-server 卸载当前版本的webpack-dev-s 阅读全文
posted @ 2020-08-20 13:35 鸣人卷~~ 阅读(742) 评论(0) 推荐(0)
vue项目报错，解决Module build failed: Error: Cannot find module 'node-sass' 问题
摘要：1、报错问题 1 E:\WebStormFile\treehole-manage>npm run dev 2 > xc-ui-pc-sysmanage@1.0.0 dev E:\WebStormFile\treehole-manage 3 > webpack-dev-server --inline 阅读全文
posted @ 2019-11-07 10:37 鸣人卷~~ 阅读(7367) 评论(0) 推荐(1)
webpack打包过程及开发过程
摘要：1、传统： 1）分模块去定义js。js中要导出将来要被打包的方法module.exports 2）定义main.js入口文件（主文件）。在此文件中，导入引用的js文件 var {add} = require("./model01.js") //var {add} = require("./model 阅读全文
posted @ 2019-11-06 11:15 鸣人卷~~ 阅读(4276) 评论(0) 推荐(0)
安装webpack的流程及注意事项
摘要：1）webpack依赖于node.js（node.js使用npm安装我们所依赖的js包） 2）安装npm（npm 全称是Node Package Manager，他是node包管理和分发工具） 3）通过npm安装webpack npm的工作原理：去远程下载所依赖的js包 4）cnpm 可以代替npm 阅读全文
posted @ 2019-11-06 09:10 鸣人卷~~ 阅读(190) 评论(0) 推荐(0)
webpack打包发布项目
摘要：1、打包 ：npm run build 2、发布： 1）使用静态服务器工具包 npm install -g serve serve dist 访问：http://www.localhost.5000 2)使用动态web服务器（Tomcat）【了解！】 1. 修改配置：webpack.prod.con 阅读全文
posted @ 2019-10-19 15:57 鸣人卷~~ 阅读(1176) 评论(0) 推荐(0)
webpack 中如何使用 vue
摘要：1. 安装vue的包： cnpm i vue -S 2. 由于 在 webpack 中，推荐使用 .vue 这个组件模板文件定义组件，所以，需要安装 能解析这种文件的 loader cnpm i vue-loader vue-template-complier -D 3. 在 main.js 中，导 阅读全文
posted @ 2019-08-26 17:31 鸣人卷~~ 阅读(168) 评论(0) 推荐(0)
在webpack中配置.vue组件页面的解析
摘要：1. 运行`cnpm i vue -S`将vue安装为运行依赖； 2. 运行`cnpm i vue-loader vue-template-compiler -D`将解析转换vue的包安装为开发依赖； 3. 运行`cnpm i style-loader css-loader -D`将解析转换CSS的 阅读全文
posted @ 2019-08-26 17:26 鸣人卷~~ 阅读(1098) 评论(0) 推荐(0)
使用`html-webpack-plugin`插件配置启动页面
摘要：由于使用`--contentBase`指令的过程比较繁琐，需要指定启动的目录，同时还需要修改index.html中script标签的src属性，所以推荐大家使用`html-webpack-plugin`插件配置启动页面.1. 运行`cnpm i html-webpack-plugin --save- 阅读全文
posted @ 2019-08-26 14:28 鸣人卷~~ 阅读(943) 评论(0) 推荐(0)
实现webpack的实时打包构建
摘要：1. 由于每次重新修改代码之后，都需要手动运行webpack打包的命令，比较麻烦，所以使用`webpack-dev-server`来实现代码实时打包编译，当修改代码之后，会自动进行打包构建。2. 运行`cnpm i webpack-dev-server --save-dev`安装到开发依赖3. 安装 阅读全文
posted @ 2019-08-26 14:18 鸣人卷~~ 阅读(682) 评论(0) 推荐(0)
使用vue-cli脚手架快速构建项目
摘要：1、创建一个文件夹，vscode打开 2、ctr + shift+` 打开指令窗口 3、npm i vue-cli -g 安装vue-cli 4、vue -V 测试安装版本 检查是否安装成功 5、vue init webpack 初始化 6、在当前文件新建项目 7、install vue-route 阅读全文
posted @ 2019-08-26 09:47 鸣人卷~~ 阅读(142) 评论(0) 推荐(0)