问题
What is the best way of sharing code between frontend and backend using javascript
, specifically saying between nodejs
and angularjs
?
Thing is that we are using same enums
and constant values
such as error codes
in both backend and frontend. Right now we just copy&paste each change to both platform which isn't a good solution. There are also some services that could be shared.
I have seen libraries such as browserify
; but thats not exactly what I am looking for. I am looking for a solution similar to maven dependency
in java
. In java
, libraries can be shared easily using maven
, whereas I can't find a similar way of doing that in javascript
.
Is there a way to isolate these services and give them as dependency to nodejs
using npm
and to angularjs
using bower
independently? Or what are the ways for sharing the same code between frontend and backend?
回答1:
There are several ways to do this. The first is that you can make a new package which is required via bower for the front-end code and via npm for the backend code. I have several packages published to both systems.
Install with Bower -- information on how to install modules that aren't in the registry
NPM Install docs -- all the ways to install with npm (private github with auth: git+ssh://git@github.com/[org]/[repo]
)
Just create a new module with your shared data and install it using both package managers. Both of them allow you to install an unpublished module so if it's private data you can keep it as such.
If your front end requires require.js
you can use something like amdefine to make it available to your node backend, or if you're just using legacy window code you can do something like:
var mydata = {};
if(typeof window !== 'undefined'){
window.mydata = mydata;
} else {
module.exports = mydata;
}
If you are sharing a lot of data though I highly recommend looking into browserify to write your entire codebase in commonjs and using browserify to generate your client bundle. There is a laundry list of resources about using browserify, including stuff on how to use browserify and angular together
回答2:
Disclaimer - I'm still developing this approach and it's a little manual.
I did this using npm, an npm cli called pac, and bower. Pac let's me avoid using npm install
in production by keeping the modules as .tgz files (committed to project in source control). With pac, when someone checks out the node project, they run pac install
then npm rebuild
instead of npm install
.
My shared code is kept in a directory (my-module). It has both package.json and a bower.json.
My consuming node app has a package.json dependency for: "my-module" : "x.y.z"
My consuming client has a bower.json dependency for: "my-module" : "../relative/path/to/my-module"
When I make updates to my-module, I update my node app by:
- Making a tar.gz of the contents of my-module:
tar -czvf my-module.tar.gz -C my-module
- Removing the old version from the node app's node_modules
- Rerunning
npm install path/to/my-module-tar.gz
- Rerunning pac (this makes a .tgz of node_modules/my-module)
- Committing the updated pac .modules/my-module.tgz
I update my client by:
- Removing the old client/bower_components/my-module
- Rerunning
bower install
orbower update
来源:https://stackoverflow.com/questions/25069777/sharing-code-between-angularjs-and-nodejs