PlayNicely.NpmNpx
1.2.1-prerelease-20240124-110311
See the version list below for details.
dotnet add package PlayNicely.NpmNpx --version 1.2.1-prerelease-20240124-110311
NuGet\Install-Package PlayNicely.NpmNpx -Version 1.2.1-prerelease-20240124-110311
<PackageReference Include="PlayNicely.NpmNpx" Version="1.2.1-prerelease-20240124-110311"> <PrivateAssets>all</PrivateAssets> <IncludeAssets>runtime; build; native; contentfiles; analyzers</IncludeAssets> </PackageReference>
paket add PlayNicely.NpmNpx --version 1.2.1-prerelease-20240124-110311
#r "nuget: PlayNicely.NpmNpx, 1.2.1-prerelease-20240124-110311"
// Install PlayNicely.NpmNpx as a Cake Addin #addin nuget:?package=PlayNicely.NpmNpx&version=1.2.1-prerelease-20240124-110311&prerelease // Install PlayNicely.NpmNpx as a Cake Tool #tool nuget:?package=PlayNicely.NpmNpx&version=1.2.1-prerelease-20240124-110311&prerelease
npm-npx
NuGet package to inject npm
and npx
tooling into your project.
The purpose of this project is to support node_modules
that handle build time tasks in web/js projects, such as
the awesome tailwindcss, Sass, or TypeScript
(without having to install these modules globally, although Node.js does need to be installed).
Installation
Simply install this package into your project like any other NuGet dependency.
Install-Package PlayNicely.NpmNpx
Getting Started
The default settings create a package.json
if there isn't one already (during build), using npm init -y
, in the project
root directory (the owning project of this dependency). That @(NpmProject)
is the one included in the build.
This project on its own doesn't do anything particularly interesting. The easiest way to utilize it is to use one of
its leaf projects for sass or tailwindcss. But if you need to add a npm package for something else, you can and it
allows you to call it during the dotnet build
process.
An example with tailwindcss
Let's say you want to use tailwindcss in you web project. From a shell:
- Install tailwindcss as a dev dependency, and create a base
tailwind.config.js
.npm install -D tailwindcss npx tailwindcss init
- Configure your tailwind environment.
- Add a tailwindcss build
<Target>
to your (csproj) project file. Notice that the target (below) depends onnpm-install
andBeforeBuild
. It depends on the node modules being installed and any BeforeBuild processing, before generating the tailwind site.css file.<Target Name="tailwind-build" DependsOnTargets="npm-install;BeforeBuild"> <Exec Command="npx tailwind build -i ./src/site.css -o ./wwwroot/css/site.css" /> <ItemGroup> <Content Include="wwwroot/css/site.css" Exclude="@(Content)" /> </ItemGroup> </Target>
Configuration
The package includes two MSBuild Project files, that are <Import>
ed into your project:
PlayNicely.NpmNpx.props
- contains the most common default properties for node projects,package.json
file in the root of the project.NpmRootDirectory
- The root of the node project, defaults to the project that is installing this dependency.NpmProject
- A default (MSBuild) itemNpmProject
, this is thepackage.json
file in the root of the dependent project.
PlayNicely.NpmNpx.targets
- A basic set of (MSBuild) targets:npm-version
andnpx-version
- to check thatnpm
andnpx
, respectively, are installed and fail the build if they aren't.npm-init
- Runsnpm init -y
for any@(NpmProject)
items that have not been initialized with apackage.json
.npm-install
- Runsnpm install
for any@(NpmProject)
items, to ensure node dependencies have been installed locally.
Other properties that effect build:
<NpxRequired>
- set this tofalse
if your build does not require thenpx
tool. If this property isfalse
, then the build will not fail ifnpx
is not detected. The default for this property istrue
.<NpmAutoInit>
- set this tofalse
if you want to manually initialize your node project, withnpm init
. The default for this property istrue
.
Multiple NpmProject's
The most common scenario is for a web project to contain a single package.json
file and node_nodules
directory. You can
have multiple projects by defining them in you MSBuild (csproj) project file. Each node project must be in it's own
directory.
npm init -y for missing package.json files.
If a @(NpmProject)
is defined but the package.json
has not been created, the build targets will initialize those directories
using npm init -y
by default. This creates an empty node project with no dependencies (unless the project directory already
contains a node_modules directory). This is a convience for the build, but you will still need to add your own npm
dependencies using npm install
.
It is recommended that you create your package.json
files manually and add any dependencies using npm init
and
npm install
, if you don't, the build targets will call npm init -y
for each @(NpmProject)
that is defined where the
package.json
does not exist. This auto init of the package.json
file can be disabled by setting the build property
<NpmAutoInit>false</NpmAutoInit>
.
Learn more about Target Frameworks and .NET Standard.
-
.NETStandard 1.0
- No dependencies.
NuGet packages (1)
Showing the top 1 NuGet packages that depend on PlayNicely.NpmNpx:
Package | Downloads |
---|---|
PlayNicely.Sass
An MSBuild targets package that adds support for the sass transpiler in a .NET project. |
GitHub repositories
This package is not used by any popular GitHub repositories.