RudiBech.Parcel.AspNetCore 0.2.4

.NET Core 2.1

The owner has unlisted this package. This could mean that the package is deprecated, has security vulnerabilities or shouldn't be used anymore.

Requires NuGet 3.3 or higher.

dotnet add package RudiBech.Parcel.AspNetCore --version 0.2.4

NuGet\Install-Package RudiBech.Parcel.AspNetCore -Version 0.2.4

This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.

<PackageReference Include="RudiBech.Parcel.AspNetCore" Version="0.2.4" />

For projects that support PackageReference, copy this XML node into the project file to reference the package.

paket add RudiBech.Parcel.AspNetCore --version 0.2.4

The NuGet Team does not provide support for this client. Please contact its maintainers for support.

#r "nuget: RudiBech.Parcel.AspNetCore, 0.2.4"

#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.

// Install RudiBech.Parcel.AspNetCore as a Cake Addin
#addin nuget:?package=RudiBech.Parcel.AspNetCore&version=0.2.4

// Install RudiBech.Parcel.AspNetCore as a Cake Tool
#tool nuget:?package=RudiBech.Parcel.AspNetCore&version=0.2.4

The NuGet Team does not provide support for this client. Please contact its maintainers for support.

RudiBech.Parcel.AspNetCore

AspNet Core middelware for Parcel allowing you to start Parcel when running your AspNet Core application. It is based on- and works the same way as WebPack middelware.

This package will ensure that Parcel runs when you start your AspNetCore application, and that it runs parcel build index.html when you build it with release configuration. It will also ensure that the generated files are added to your application as part of the publish phase.

The defaults in this package assumes that you have an index.html in the root of your application (same level as .csproj), and that you want the generated output to be placed in wwwroot. The debug files will be placed in wwwroot/debug and served by parcel through the middelware. When building for release it will put the files in wwwroot.

Warning: This middelware is not magic, and currently it does not handle issues where Parcel itself freezes. Please try running Parcel from command line if something seems broken as it is easy to miss errors logged to the console alongside other output from Kestrel. I welcome input or pull requests for making this more robust.

Requirements

Node.js
- To test if this is installed and can be found, run node -v on a command line
- Note: If you're deploying to an Azure web site, you don't need to do anything here - Node is already installed and available in the server environments
.NET Core 2.1 or later

Getting started

mkdir AspNetCoreWithParcel
cd AspNetCoreWithParcel
dotnet new web
npm init -y
npm install parcel-bundler --save-dev
dotnet add package RudiBech.Parcel.AspNetCore

Then change your Startup.cs similar to this:

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
  app.UseMvc();

  if (env.IsDevelopment())
  {
    app.UseDeveloperExceptionPage();
    //Remember to add using RudiBech.AspNetCore.SpaServices.Parcel;
    app.UseParcelDevMiddleware();
  }
  else
  {
    app.UseStaticFiles();
  }
}

Then add an index.html as your Parcel entry point. You can use a different entry point by using the available override on UseParcelDevMiddleware. You will then also need to add a couple of properties to your csproj file:

<PropertyGroup>
  
  
  <ParcelAspNetCoreEntryPoint>somePath/index.js</ParcelAspNetCoreEntryPoint>
  
  <ParcelAspNetCoreOutDir>dist</ParcelAspNetCoreOutDir>
</PropertyGroup>

Please note: This only gives you a starting point. You still need to set up your project with other dependencies. E.g. to get up and running with Vue and HMR you should add the following dependencies:

npm install vue --save-dev
npm install vue-template-compiler --save-dev
npm install @vue/component-compiler-utils --save-dev
npm install babel-preset-env --save-dev

Basic index.html (to get you started):

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Vue js Setup With Parcel</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    <div>
        <h2>Simple Vue.js Parcel Starter Kit</h2>
        <div id="app"></div>
    </div>
    <script src="./src/app.js"></script>
</body>
</html>

Sample src/app.js:

import Vue from 'vue';
import App from './App.vue';

new Vue({
  el: '#app',
  render: h => h(App)
});

Sample src/App.vue:

<template>
  <div>
    <h3>{{ data }}</h3>
  </div>
</template>

<script>
export default {
  data () {
    return {
      data: 'Welcome to parcel bundler'
    }
  }
}
</script>

If you combine this with Material Design Components and e.g. vue-mdc-adapter and try to use .scss imports like @import '~vue-mdc-adapter/dist/styles' then you will most likely run into issues with nested packages. A workaround for this is to add a file .sassrc.js with the following content:

const path = require('path')
const CWD = process.cwd()

module.exports = {
  "includePaths": [
    path.resolve(CWD, 'node_modules/'),
  ]
}

This causes performance issues, so please consider other alternatives if possible.

Product	Compatible and additional computed target framework versions.
.NET	net5.0 was computed. net5.0-windows was computed. net6.0 was computed. net6.0-android was computed. net6.0-ios was computed. net6.0-maccatalyst was computed. net6.0-macos was computed. net6.0-tvos was computed. net6.0-windows was computed. net7.0 was computed. net7.0-android was computed. net7.0-ios was computed. net7.0-maccatalyst was computed. net7.0-macos was computed. net7.0-tvos was computed. net7.0-windows was computed. net8.0 was computed. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed.
.NET Core	netcoreapp2.1 is compatible. netcoreapp2.2 was computed. netcoreapp3.0 was computed. netcoreapp3.1 was computed.

Product

.NET