在前端开发中，我们经常需要使用一些模板来帮助我们快速搭建项目结构。这时候，npm-build-boilerplate 这个 npm 包就显得非常有用了。这个包提供了一个基本的项目结构，使得我们可以快速开始一个新项目的开发。
安装 npm-build-boilerplate
要使用 npm-build-boilerplate，你需要在命令行里执行以下命令进行安装：
npm install -g npm-build-boilerplate
这条命令会全局安装这个包，并把 npm-build-boilerplate 命令加入到 PATH 环境变量中，这样你就可以直接在命令行里使用 npm-build-boilerplate 命令。
使用 npm-build-boilerplate
使用 npm-build-boilerplate 构建一个新项目非常简单，只需要在命令行里执行以下命令：
npm-build-boilerplate my-project
这个命令会将 npm-build-boilerplate 项目的所有文件拷贝到一个名为 my-project 的目录中，然后安装所有必要的依赖包。
项目结构
npm-build-boilerplate 创建的项目基本结构如下：
-- -------------------- ---- ------- ----------- --- ---- - --- ------- - --- --- - --- ----- --- -------- --- --------- --- ---------- --- ---------- --- ------------ --- --------- --- -----------------
其中，src 目录存放项目的源码，.babelrc 和 .eslintrc 是 Babel 和 ESLint 的配置文件，.gitignore 则是 Git 的忽略文件列表，index.html 是项目首页，package.json 是项目的配置文件，README.md 则是项目的说明文件。最后一个文件 webpack.config.js 则是 Webpack 的配置文件。
编写和运行代码
在安装和构建完 npm-build-boilerplate 项目之后，你可以在 src 目录下编写你自己的代码，然后使用 Webpack 进行编译和运行。
在命令行里运行以下命令来启动项目：
npm run dev
这个命令会使用 Webpack 在本地启动一个开发服务器，并监听文件变化自动重新编译。
当你需要构建生产环境的代码时，可以使用以下命令：
npm run build
这个命令会将项目捆绑成一个最小化且优化的生产构建，可以在生产环境中使用。
小结
npm-build-boilerplate 提供了一个快速开发前端项目的基本结构，使得我们能够更快地开始一个新项目的开发。这篇文章介绍了如何安装和使用 npm-build-boilerplate，同时对项目的结构、代码编辑和运行进行了说明。希望这篇文章能对前端开发者有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005672581e8991b448e3a04