Skip to content

Nx powered starter project for Angular with SpartanUI

Notifications You must be signed in to change notification settings

touhidrahman/nx-starter

Repository files navigation

NX Starter

This workspace has been generated by Nx, Smart Monorepos · Fast CI.

Notes

Common dependencies by Spartan-Ng

  • ngx-scrollbar
  • embla-carousel
  • clsx

Common Tasks

Remove spec files

find ./apps -type f -name "*.spec.ts" -exec rm -f {} +
find ./libs -type f -name "*.spec.ts" -exec rm -f {} +

Spartan UI Scripts

Update your package.json with following:

    "spartan1of3": "pnpm add -D @spartan-ng/cli@latest --strict-peer-dependencies",
    "spartan2of3": "pnpm add @spartan-ng/ui-core@latest --strict-peer-dependencies",
    "spartan3of3": "pnpm dlx nx g @spartan-ng/cli:ui",

Updating spartan UI

  • Run pnpm spartan1of3 to upgrade spartan cli.
  • Remove libs/ui directory.
  • Remove all @spartan/* paths from tsconfig.base.json.
  • Run pnpm spartan2of3
  • Run pnpm spartan3of3 and follow instructions. Enter libs/ui when asked about install folder. Select all components when prompted. (Omit helm if you encounter error)
  • Finally run npm run format

Setup tailwind for a new project

npx nx generate @nrwl/angular:setup-tailwind <<app_name>>

Prepare git hooks

Run npm run prepare which will create .husky/precommit file. Open the file and write npm run pre-commit.

Start the app

To start the development server run nx serve tailwind-test. Open your browser and navigate to http://localhost:4200/. Happy coding!

Generate code

If you happen to use Nx plugins, you can leverage code generators that might come with it.

Run nx list to get a list of available plugins and whether they have generators. Then run nx list <plugin-name> to see what generators are available.

Learn more about Nx generators on the docs.

Running tasks

To execute tasks with Nx use the following syntax:

nx <target> <project> <...options>

You can also run multiple targets:

nx run-many -t <target1> <target2>

..or add -p to filter specific projects

nx run-many -t <target1> <target2> -p <proj1> <proj2>

Targets can be defined in the package.json or projects.json. Learn more in the docs.

Want better Editor Integration?

Have a look at the Nx Console extensions. It provides autocomplete support, a UI for exploring and running tasks & generators, and more! Available for VSCode, IntelliJ and comes with a LSP for Vim users.

Ready to deploy?

Just run nx build demoapp to build the application. The build artifacts will be stored in the dist/ directory, ready to be deployed.

Set up CI!

Nx comes with local caching already built-in (check your nx.json). On CI you might want to go a step further.

Explore the Project Graph

Run nx graph to show the graph of the workspace. It will show tasks that you can run with Nx.

Connect with us!

About

Nx powered starter project for Angular with SpartanUI

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published