How to use one package manager for backend and frontend? (Yarn/NPM)

吃可爱长大的小学妹 提交于 2020-01-23 01:34:05

问题


Previously I would use NPM for server side stuff and Bower for frontend. NPM would install to the node_modules/ directory and I had a .bowerrc to install those packages to public/lib.

Now I've begun to use Yarn instead of NPM; and since they are pretty much 1:1 compatible it has been a smooth change.. However, now I'm wondering if I can ditch Bower and just use Yarn for everything. But I do not see a way (in either NPM or Yarn) to install normal packages to node_modules, but then have a sort of separate option to put some packages in public/... Something similar to the --dev option but instead it would be yarn add jquery --public. Does anything like this exist?

One option, of course, would be to install all packages to the public/ directory but I believe this is a bad practice (correct me if I'm wrong).

Another option might be to have a separate package.json in the public/ folder and run separate Yarn commands in there for frontend packages, but it's just a bit less convenient, I think; more error prone.


回答1:


The norm pretty much is something like:

  1. Install packages via yarn
  2. Use a task runner such as gulp, or module loader & bundler such as webpack to create the bundles you need.
    • This all depends on your stack, there are obviously others, for example in the past I've used .NET's native bundling, which you can achieve the same as gulp/webpack... again this is for you to decide.

The gist of it is, install all the modules in a central place (using a package manager), then have a loader or other process grab and move the required assets to the location that you need to use them.

I'd suggest having a look at a kickstart project (pertaining to the stack that you're using) eg: I've used : Fountainjs in the past with success, or look into Yeoman if fountain doesnt strike your fancy (fyi. Fountain is built on top of Yeoman)

In pseudo commands:

1. yarn install     /// installs all assets
2. gulp build       /// cleans out current public folder, bundles & copies new
3. gulp serve       /// runs your app


来源:https://stackoverflow.com/questions/46775214/how-to-use-one-package-manager-for-backend-and-frontend-yarn-npm

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!