本地搭建npm+webpack+express+axios项目练习

第一步:

进行npm init ,创建package.json

图中出现的git相关的内容是由于我是先在github上面创建项目,然后本地npm init完成后便出现了相关git内容。

第二步:

下载相关要使用的依赖包,此次项目不会涉及到vue相关的,主要是写入html为主

npm install express --save-dev

由于平时涉及的都是使用vue-resource,此次改为使用axios,第一次使用

npm install axios --save-dev

下载webpack还发生了一个小插曲

npm install webpack@4.8.3 --save-dev

npm install webpack-cli@3.3.2 --save-dev

第三步:

根目录下直接创建目录src,并在目录下创建index.js,在package.json中添加build命令,到时在命令行直接运行npm run build即可。

第四步:

安装babel,兼容ES6,这里面由于一些依赖包依赖问题,花了一个多小时才下载完成。

npm install babel --save-dev

本地的webpack是4.8.3版本的,babel直接下载的是6.23.0版本的。

npm install babel-loader@7.1.5 --save-dev

由于babel用的是6.X版本的,看babel-loader文档,需要使用7.X版本的,于是在npm官网上找了一个下载量比较多的7.1.5版本的。

npm install babel-core babel-preset-es2015 --save-dev

安装完babel后便可以尝试写下ES6语法打包测试下了,我直接是使用import/export进行测试。

现在也支持ES6,主要的依赖包到这边算是安装完成,接下来便是安排express和axios了,开始敲代码。。。

整理的内容有不成熟的地方还请多多指教!!!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容