Javascript 如何在您的 Ionic / AngularJs 应用程序中包含和使用节点模块?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/32243203/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 07:48:05  来源:igfitidea点击:

How to include and use node modules in your Ionic / AngularJs app?

javascriptangularjsnode.jsionic-frameworkionic

提问by shawnr

I have an Ionic app and I'd like to include the node module angular-base64to use in my controllers, or even wrap inside an angular service etc. I've gone ahead and ran

我有一个 Ionic 应用程序,我想包含节点模块angular-base64以在我的控制器中使用,或者甚至包含在一个 angular 服务等中。我已经继续运行了

npm install angular-base64

Which went ahead and installed the folder containing angular-base64.min.jsfile inside /myIonicApp/node_modules/. So the full path to the file is /myIonicApp/node_modules/angular-base64/angular-base64.min.js.

继续并安装了包含angular-base64.min.js文件的文件夹/myIonicApp/node_modules/。所以文件的完整路径是/myIonicApp/node_modules/angular-base64/angular-base64.min.js.

However when I try and make use of the module in one of my controllers like this:

但是,当我尝试在我的一个控制器中使用该模块时:

app.controller('myController', ['$scope', '$base64',
  function($scope, $base64) {

    //$base64... 

  }
]);

It has no idea what I'm talking about. Do I have to do something else to get this to work? Perhaps something in my app.js?

它不知道我在说什么。我是否必须做其他事情才能使其正常工作?也许我的东西app.js

采纳答案by Max Flex

The accepted answer is no longer accurate for Ionic V2and the .bowerrcwas removed from default installation.

接受的答案对于Ionic V2不再准确,并且.bowerrc已从默认安装中删除。

Here is how you do it now, from the official Ionic V2 docs.

这是你现在如何做的,来自官方的 Ionic V2 文档。

To add a third party library to an app, run the following command:

npm install --save

要将第三方库添加到应用程序,请运行以下命令:

npm 安装 --save

eg: Using the imported function

例如:使用导入的函数

// named export pattern

import { myFunction } from 'theLibraryName';

...

// use the imported functionality

myFunction();

// 命名导出模式

从 'theLibraryName' 导入 { myFunction };

...

// 使用导入的功能

我的函数();

回答by shawnr

The accepted answer is not correct. In order to add client-side modules to your Ionic/AngularJS app, you should use Bower and not NPM. NPM should only be used to install modules that are part of the development/build/deployment processes. Anything you want to come across to your users as part of the client-side package should be managed by Bower.

接受的答案不正确。为了将客户端模块添加到您的 Ionic/AngularJS 应用程序,您应该使用 Bower 而不是 NPM。NPM 应该只用于安装作为开发/构建/部署过程一部分的模块。您希望作为客户端包的一部分向用户提供的任何内容都应由 Bower 管理。

If you look in the .bowerrcfile, you'll see the following:

如果您查看.bowerrc文件,您将看到以下内容:

{
  "directory": "www/lib"
}

This configuration sets the www/libdirectory as the home for everything installed by bower. If you use the following command, the package will be installed in the correct location:

此配置将www/lib目录设置为 bower 安装的所有内容的主目录。如果使用以下命令,软件包将安装在正确的位置:

bower install --save angular-base64

bower install --save angular-base64

(The --saveflag saves the dependency in your bower.jsonfile.)

(该--save标志将依赖项保存在您的bower.json文件中。)

You may now add the script tag to your index.htmlfile: <script src="lib/angular-base64/angular-base64.min.js"></script>

您现在可以将脚本标签添加到您的index.html文件中:<script src="lib/angular-base64/angular-base64.min.js"></script>

You will also need to inject the module into your app as described above. In app.jsadd the module like so: angular.module('starter', ['base64'])

您还需要将模块注入到您的应用程序中,如上所述。在app.js添加模块,像这样:angular.module('starter', ['base64'])

When using tools like Bower or NPM, I find that having to make manual modifications to an installation is often the first sign that I've done it wrong!

在使用 Bower 或 NPM 等工具时,我发现必须对安装进行手动修改通常是我做错的第一个迹象!

回答by Vidul

  • Place the directory angular-base64/angular-base64.min.jsin www/lib.

  • Include the JS file in index.html(for example: <script src="lib/angular-base64/angular-base64.min.js"></script>.

  • Inject the module in app.js: angular.module('starter', ['base64']).

  • 将目录angular-base64/angular-base64.min.js放在www/lib.

  • 将 JS 文件包含在index.html(例如:<script src="lib/angular-base64/angular-base64.min.js"></script>.

  • app.js: 中注入模块angular.module('starter', ['base64'])

Afterwards you should be able to use base64everywhere in your app.

之后,您应该可以base64在您的应用程序中的任何地方使用。