diff --git a/docs/lab3/LAB.md b/docs/lab3/LAB.md index 5b0856b..55607c8 100644 --- a/docs/lab3/LAB.md +++ b/docs/lab3/LAB.md @@ -7,9 +7,9 @@ We'll build the app we just created, and look at what executors are and how to c ## 📚 Learning outcomes: - **Understand what a `target` and `executor` are** +- **Understand how to view Project Details** - **Invoke executors** - **Configure executors by passing them different options** -- **Understand how an executor can invoke another executor** #### 📲 After this workshop, you should have: @@ -27,24 +27,24 @@ We'll build the app we just created, and look at what executors are and how to c Nx executor command structure
-2. You should now have a `dist` folder - let's open it up! +2. There should be a `dist` folder in the root of the workspace- let's open it up! - - This is your whole app's output! If we wanted to, we could push this to a server, and it would all work. + - This is the whole app's output! If we wanted to, we could push this to a server, and it would all work. - Notice how all files have hashes in their suffix. - Open one of the files, for example, `main.{hash}.js`, and look at its contents. Notice how it's minified.
-3. Open the **Project Details** for your `store` app and expand the `build` section listed under "Targets." +3. Open the **Project Details** for the `store` app and expand the `build` section listed under "Targets." - This is a **target** that uses the [`nx:run-commands`](https://nx.dev/nx-api/nx/executors/run-commands#nxruncommands) **executor** to call `webpack-cli` to build the app. - - Since the build target uses the [`webpack-cli`](https://webpack.js.org/api/cli/), like you would with any other webpack build, you can configure webpack using the `webpack.config.js` file in your project. + - Since the build target uses the [`webpack-cli`](https://webpack.js.org/api/cli/), webpack can be configured using the `webpack.config.js` file in the project root.
🐳   Hint - The easiest way to open the Project Details is by using the Nx Console from within VS Code or a JetBrains IDE. Once installed, you can access the Project Details Views in multiple ways without leaving your editor. + The easiest way to open the Project Details is by using the Nx Console from within VS Code or a JetBrains IDE. Once installed, the Project Details Views can be accessed in multiple ways without leaving the editor.

- If you prefer to use the CLI, or are using an editor without Nx Console support, you can also open the project details in your browser by running `nx show project --web`. + If the CLI is preferred, or editor without Nx Console support is being used, the project details can be opened in the browser by running `nx show project --web`.

4. Configure license extraction during production builds @@ -73,7 +73,7 @@ We'll build the app we just created, and look at what executors are and how to c
🐳   Hint - - The key you need to add to the `project.json` is `targets.build.configurations.development.args`. + - The key to add to the `project.json` is `targets.build.configurations.development.args`. - Use the Project Details view to see how the environment is being set to production as an example.