vue-webpack的基本使用

在webpack目录下新建dist目录,src目录

使用npm init -y 初始化,生成package.json文件

npm install -S 和 npm install -D的区别

-S就是--save的简写,--save会将包的名称及版本号放在dependencies里面。
-D就是--save-dev 这样安装的包的名称及版本号就会存在package.json的devDependencies这个里面

给当前项目安装jquery

npm i jquery -S
npm i webpack -g
npm i webpack -D

然后打包js文件

webpack ./src/page/index/index.js -o ./dist/app.js
webpack 打包文件 -o 打包到文件地址
新版的webpack要加-o 才能执行成功

使用 webpack-dev-server 帮我们自动打包
使用的方法
1.首先安装webpack-dev-server
cnpm i webpack-dev-server -D
然后在项目下的package.json文件里面的scripts字段里面添加
"dev": "webpack-dev-server"

然后使用npm run dev,就能够运行webpack-dev-server脚本了
注意webpack-dev-server帮我们打包生成的bundle.js文件并没有存储到实际的物理磁盘上,而是直接托管到了电脑的内存中,所以,我们在项目目录中,根本找不到打包好的bundle.js文件

你可能感兴趣的:(vue-webpack的基本使用)