Adding pluggable widget release docs

content/en/docs/howto/extensibility/pluggable-widgets/create-a-pluggable-widget-one.md

@@ -97,7 +97,7 @@ There is also a watcher available that will rebuild your widget as you make chan
 
 ### Using the Widget
 
-When the build script completes it will package your widget as a `.mpk` file and copy it to the `widgets/` directory in your Mendix app. Now that the generator has finished its job it is time to use the widget in Studio Pro. To use the widget, do the following:
+When the build script completes it will package your widget as a *.mpk* file and copy it to the `widgets/` directory in your Mendix app. Now that the generator has finished its job it is time to use the widget in Studio Pro. To use the widget, do the following:
 
 1. To find your widget for the first time, you need to refresh the file system Studio Pro is looking at. Use <kbd>F4</kbd> or select **App** > **Synchronize Project Directory** from the Studio Pro menu bar.
 1. Open the **Home_Web** page in the page editor.
@@ -356,6 +356,18 @@ Our widget now looks like a Mendix widget, but does not behave like one yet. Whi
 
     * By defining a callback prop, a component advertises what data it is able to provide. Consumers of the callback get to decide how to respond to the availability of the new data. In this case we decided in `TextBox` that each time `TextInput` has new data, it is given to `props.textAttribute.setValue()`.
 
+## Building & Releasing Your Widget
+
+Development build tested successfully. You can now create a release build to bundle with your module or publish the widget to the Marketplace.
+
+{{% alert color="info" %}}**Dev Build vs. Release Build**: Release builds are minified, optimized, and stripped of heavy console logging/source maps for optimal runtime performance in production. {{% /alert %}}
+
+1. Run `npm run prerelease` to scan for any linting errors.
+1. Fix any errors that are found.
+1. Run `npm run release` to create a release build.
+1. Locate the generated *.mpk* file at `{widgetName}/dist/{version}/{widgetName}.mpk`.
+1. Use this *.mpk* file for the Marketplace release or include it in your module for production.
+
 Congratulations, you have now made a fully functional input widget!
 
 Continue with the next tutorial to learn how to add validation feedback, custom validations, and an on-change event activity. You will also learn how to handle a read-only state, improve web accessibility, and make a Studio Pro preview.

content/en/docs/howto10/extensibility/pluggable-widgets/create-a-pluggable-widget-one.md

@@ -101,7 +101,7 @@ NPM version 7 changed the resolution behavior of peerDependencies. Try adding `-
 
 ### Using the Widget
 
-When the build script completes it will package your widget as a `.mpk` file and copy it to the `widgets/` directory in your Mendix app. Now that the generator has finished its job it is time to use the widget in Studio Pro. To use the widget, do the following:
+When the build script completes it will package your widget as a *.mpk* file and copy it to the `widgets/` directory in your Mendix app. Now that the generator has finished its job it is time to use the widget in Studio Pro. To use the widget, do the following:
 
 1. To find your widget for the first time, you need to refresh the file system Studio Pro is looking at. Use <kbd>F4</kbd> or select **App** > **Synchronize Project Directory** from the Studio Pro menu bar.
 1. Open the **Home_Web** page in the page editor.
@@ -357,6 +357,18 @@ Our widget now looks like a Mendix widget, but does not behave like one yet. Whi
 
     * By defining a callback prop, a component advertises what data it is able to provide. Consumers of the callback get to decide how to respond to the availability of the new data. In this case we decided in `TextBox` that each time `TextInput` has new data, it is given to `props.textAttribute.setValue()`.
 
+## Building & Releasing Your Widget
+
+Development build tested successfully. You can now create a release build to bundle with your module or publish the widget to the Marketplace.
+
+{{% alert color="info" %}}**Dev Build vs. Release Build**: Release builds are minified, optimized, and stripped of heavy console logging/source maps for optimal runtime performance in production. {{% /alert %}}
+
+1. Run `npm run prerelease` to scan for any linting errors.
+1. Fix any errors that are found.
+1. Run `npm run release` to create a release build.
+1. Locate the generated *.mpk* file at `{widgetName}/dist/{version}/{widgetName}.mpk`.
+1. Use this *.mpk* file for the Marketplace release or include it in your module for production.
+
 Congratulations, you have now made a fully functional input widget!
 
 Continue with the next tutorial to learn how to add validation feedback, custom validations, and an on-change event activity. You will also learn how to handle a read-only state, improve web accessibility, and make a Studio Pro preview.

content/en/docs/howto9/extensibility/pluggable-widgets/create-a-pluggable-widget-one.md

@@ -384,9 +384,21 @@ The value from the attribute can be displayed and updated using the other input,
     * The `onUpdate` function is optional and it should be checked for availability before executing it
     * The custom widget TextBox will still not pass text to the Text box widget after this step—it will gain this functionality in [Build a Text Box Pluggable Widget: Part 2 (Advanced)](/howto9/extensibility/create-a-pluggable-widget-two/).
 
+## Building & Releasing Your Widget
+
+Development build tested successfully. You can now create a release build to bundle with your module or publish the widget to the Marketplace.
+
+{{% alert color="info" %}}**Dev Build vs. Release Build**: Release builds are minified, optimized, and stripped of heavy console logging/source maps for optimal runtime performance in production. {{% /alert %}}
+
+1. Run `npm run prerelease` to scan for any linting errors.
+1. Fix any errors that are found.
+1. Run `npm run release` to create a release build.
+1. Locate the generated *.mpk* file at `{widgetName}/dist/{version}/{widgetName}.mpk`.
+1. Use this *.mpk* file for the Marketplace release or include it in your module for production.
+
 Congratulations, you have now made a fully functional input widget!
 
-Continue with the next tutorial to learn how to add validation feedback, custom validations, and an on-change event activity. You will also learn how to handle a read-only state, improve web accessibility, and make a Mendix Studio Pro preview.
+Continue with the next tutorial to learn how to add validation feedback, custom validations, and an on-change event activity. You will also learn how to handle a read-only state, improve web accessibility, and make a Studio Pro preview.
 
 ## Read More