涛哥最近研究webpack和vue也有一段时间了,写篇日志总结下:
使用淘宝的npm镜像安装
1 |
npm install -g cnpm --registry=https://registry.npm.taobao.org |
一、Npm常用操作
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
1、npm init -y # 初始化npm生成package.json -y是为了不让他提很多问题让我们回复。 2、npm i 包名称 # 安装对应包名称的插件 i就是install的缩写 # 安装包的时候,对应的信息会写到package.json里面。当node_modeles被删除时,要找回来,可以根据这个json里面的信息,重新安装下载: 使用npm i命令,npm i后面什么都不加,表示把所有库重新安装。 3、npm uninstall 包名称 # 删除对应包名称依赖,对应插件会在node_modules内移除,package.json的dependencies内对应的依赖也会移除。 4、npm update 包名称 # 指定包更新到最新版,也可以指定版本号 如:npm update jquery@3.0.0 5、查看安装包的版本信息 # 比如npm info webpack 6、npm i -s与-d的区别 # npm i module_name -S 等同于 npm install module_name --save # 写入package.json的 dependencies 对象中,用于生产环境 # npm i module_name -D 等同于 npm install module_name --save-dev # 写入package.json的 devDependencies 对象中,用于开发环境 |
二、初始化项目
1 2 3 4 5 6 7 8 9 |
# 创建目录并且进入 mkdir vue-project-name # 初始化 生成package.json npm init -y # 安装 webpack 和 webpack-cli到开发依赖 npm i webpack --save-dev npm i webpack-cli --save-dev # 涛哥总结的一句话命令 mkdir vue-project-name && cd vue-project-name && npm init -y && npm i webpack webpack-cli -D |
报错解决办法
报错一:NPM Error:gyp: No Xcode or CLT version detected!
1 2 3 |
# mac上报错解决办法 $ sudo rm -rf $(xcode-select -print-path) $ xcode-select --install |
报错二:TypeError: CleanWebpackPlugin is not a constructor
1 2 3 4 5 6 7 8 9 10 11 |
# 正确的写法 const {CleanWebpackPlugin} = require('clean-webpack-plugin'); output: { path: path.resolve(__dirname, '../dist'), filename: '[name].[hash].js' } plugins: [ new CleanWebpackPlugin(), ] |
三、webpack配置结构
转载请注明:PHP笔记 » webpack工程化实践总结