美文网首页
reactjs实战(1)搭建 webpack + React 开

reactjs实战(1)搭建 webpack + React 开

作者: 执笔画愁 | 来源:发表于2017-12-28 15:21 被阅读0次

    闲话少说,直接开撸代码

    初始化环境

    首先保证 node 和 npm 环境,运行 node -vnpm -v

    如果环境已存在,进入项目目录,运行npm init 生成 package.json,所用的项目使用npm做依赖,package.json中描述了该项目的信息以及一些第三方依赖(插件),详细的使用说明可查阅官网文档,不过是英文的。

    安装插件

    webpack需要插件进行支撑,运行npm install webpack webpack-dev-server --save-dev来安装两个插件。

    安装React环境,也需要插件进行支撑,运行npm i react react-dom --save来安装两个插件,其中iinstall的简写。

    安装完成之后,package.json 可以看到多了devDependenciesdependencies两项,根目录也多了一个node_modules文件夹。

    --save 和 --save-dev 的区别

    使用--save--save-dev,可分别将依赖(插件)记录到package.json中的 dependenciesdevDependencies下面。

    dependencies下记录的是项目在运行时必须依赖的插件,常见的例如react jquery等,即及时项目打包好了、上线了,这些也是需要用的,否则程序无法正常执行。

    devDependencies下记录的是项目在开发过程中使用的插件,例如这里我们开发过程中需要使用webpack打包,而我在工作中使用fis3打包,但是一旦项目打包发布、上线了之后,webpackfis3就都没有用了,可卸磨杀驴。

    延伸一下,我们的项目有package.json,其他我们用的项目如webpack也有package.json,见./node_modules/webpack/package.json,其中也有devDependenciesdependencies。当我们使用npm i webpack时,./node_modules/webpack/package.json中的dependencies会被 npm 安装上,而devDependencies也没必要安装。

    相关文章

      网友评论

          本文标题:reactjs实战(1)搭建 webpack + React 开

          本文链接:https://www.haomeiwen.com/subject/ivhvgxtx.html