Modular practice of front-end projects 1: Build NPM private Warehouse management source and dependencies

Source: Internet
Author: User
Tags documentation docker run

The following are the practical aspects of the front-end project modularity, including the following:

    1. Build NPM private Warehouse management source and dependence;
    2. Use Webpack to package the infrastructure code;
    3. Writing a reliable class library using TypeScript
    • Benefits of using TypeScript
    • Unit testing using mocha/jest [in implementation]

This article is about the 1th part of the front-end project templating

Use Docker to build a private NPM warehouse

The use of Docker is not in this article, please refer to other documentation yourself.

After testing, Keyvanfatehi/sinopia is available.

    1. Pull the Docker image down
docker pull keyvanfatehi/sinopia
    1. Run the keyvanfatehi/sinopia .
docker run --name sinopia -d -p 4873:4873 keyvanfatehi/sinopia

My docker hostname is UBUNTU-17, at which point http://ubuntu-17/4873 you can access the private NPM Warehouse Web page.

Publish a JavaScript class library

Add a sample Class Library project mygreeting

mkdir myGreetingcd myGreetingyarn init -y # npm init -ytouch index.js

Add the following within Index.js

let greeting = function(name) {    return 'Hello ' + name;}module.exports = greeting;

This code exports a function that can be published and relied upon.

    1. NPM AddUser

The first time you use this private repository you need to add users

npm adduser --registry http://ubuntu-17:4873
    1. NPM Publish

And then post the code up there.

npm publish . --registry http://ubuntu-17:4873

NPM has its own version and release strategy, and can use the following commands to view the Help documentation

    • npm help version
    • npm help publish

The release may fail because of a version issue, and the APPEND predicate --force can be forced to publish but is not a regular operation.

Post-Release Administration page diagram

Referencing a published class library

Add a sample business item Mydemo

mkdir myDemocd myDemoyarn init -y # npm init -ytouch index.js

Reference mygreeting

yarn add myGreeting --dev --registry http://ubuntu-17:4873

Add the following within Index.js

const myGreeting = require('myGreeting');(function() {    let greeting = myGreeting('Rattz');    console.log(greeting);})();

Run up

node index.jsHello Rattz

At this point, the private NPM repository builds, class library releases, and dependent references have been completed.

The source code used for the project has been released GITHUB,JUSFRW original

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.