在本教程中，我将向你展示如何从头搭建一个 JavaScript 项目。之后，你可以继续推进该项目到前端（例如：React.js）或者后端（例如：Node.js with Express）应用程序。如果你决定开始搭建前端应用程序，我们这里将使用一种现代化的方法去配置它，不是将 JavaScript 文件链接到 HTML文件 中，而是通过项目打包器（project bundler）来为你自动化完成这个过程，这也是现在 JavaScript 项目流行的方法之一。
接下来，一起开始搭建我们的 JavaScript 应用吧。对于任何新的 JavaScript 项目，都必须有一个文件夹来分配项目的配置，最重要的就是项目的源代码。这个文件夹通常包含了存放其他 JavaScript 项目的文件夹。至少在我的项目中是这样做的。为了开始你的新项目，通过命令行创建项目文件夹或者通过你喜欢的文件夹/文件资源管理器（例如：MacOS finder、Windows资源管理器、编辑器/IDE侧栏）创建项目文件夹并导航进去。在本教程中，我们将在命令行上完成:
mkdir my-project
cd my-project
现在你已经获得了项目的文件夹。在下一步中，我们将把项目初始化为 npm 项目，这对于项目有两个好处：首先，你可以从 npm 上安装库（node packages）到你的项目上。其次，你可以添加 npm 脚本来 start，test或者在项目的后期 deploy 你的项目。在命令行使用 npm 之前，你必须安装了 npm 附带的 Node.js。然后，你可以在命令行上初始化你的 npm 项目：
npm init -y
通过添加 -y 简写标签，你可以告诉 npm 接收所有默认值。如果不使用该标签，则需要手动指定项目的相关信息，你可以尝试尝试看看有什么不同。
现在，由于使用了 npm 来初始化项目，你的项目应该有一个填充了默认配置的 package.json 文件。如果你想更改默认值，你可以使用如下命令在命令行中查看并更改它们：
npm config list
npm set init.author.name "<Your Name>"
npm set init.author.email "you@example.com"
npm set init.author.url "example.com"
npm set init.license "MIT"
设置完 npm 项目之后，你可以通过 npm 来安装相关的库（node packages）。一旦你通过 npm 将第一个库安装到你的项目中，它将会显示在你的 package.json 中作为依赖项。你还将看到一个 node_modules/ 文件夹，这里保存着已安装的库，里面保存着源代码。稍后我将介绍它。
接下来，在命令行或编辑器/IDE/explorer中，在你的项目源代码下创建一个 src/ 文件夹。在这个文件夹中，创建一个 src/index.js 文件作为项目的入口点:
mkdir src
cd src
touch index.js
该名称基于 Node.js 命名约定。你可以按照它来做，也可以自己起个名字.
现在，是时候开始编写第一个 JavaScript 了。首先，在 src/index.js 文件中引入一个 console.log() 语句，确保配置正常运行:
console.log('Hello Project.');
当你再次在命令行上导航时，你可以在你项目的根目录使用 Node.js 运行这个文件：
node src/index.js
这条日志应当在脚本执行后出现在命令行中。接下来，将这个脚本移动到 package.json 中，因为这是所有项目脚本（start，test，deploy）的最终归宿。如前所述，第一个好处就是可以在 npm 项目的 package.json 文件中定义 npm 脚本:
{
"scripts": {
"start": "node src/index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
}
在命令行上再次运行脚本，但这次是使用 npm start。每次更改 package.json 里面start的脚本的时候，你只需要在命令行上输入npm start，而不需要关系底层脚本的细节。
恭喜你~，你已经用 node 和 npm 配置了你的第一个 JavaScript 项目。从这里开始，你可以选择继续深入前端应用程序或者后端应用程序。如果你喜欢开源，也可以将此项目作为库（node package）开源。因为，可以继续学习后端应用程序系列，了解如何开放源代码。
网友评论