标签: jspm

我正在尝试使用JSPM 导入jQuery插件jQuery.scrollTo.

到目前为止我安装了它

jspm install npm:jquery.scrollto

现在我正试图导入它

import $ from 'jquery';
import scrollTo from 'jquery.scrollto';

现在我只是得到了

$(...).scrollTo is not a function

错误.

我试着去填充它,但我以前从未这样做过,如果有必要的话,就找不到如何做的好解释.你能帮我或者给我一个很好的解释,我什么时候需要什么东西？

我正在关注JSPM入门指南,我想安装jquery包,所以我执行下面的命令.

jspm install jquery

但是当我尝试在下面的打字稿中导入它时

import $ from 'jquery'

我从typescript编译器得到一个错误说error TS2307: Cannot find module 'jquery'.不仅对于其他库的这个库我得到了同样的错误.

我正在尝试使用d3 v4.0的alpha,并尝试在jspm设置中创建自定义构建.我似乎无法理解新的模块化构建是如何工作的.

如果我想从模块导入命名导出,即从d3-request导入json,我可以执行以下操作: import {json} from "d3-request";在通过jspm/npm安装模块之后.

如果我想同样安装整个库 import d3 from "d3";

如果我想安装多个模块并命名导出并在d3命名空间下将它们全部提供给我(即,在d3-request下导入d3-shape,并在同一d3全局中访问d3.json和d3.line) ,这是什么正确的语法？

我意识到当使用这些模块的独立版本时d3_shape会输出全局变量.这是为了在将这些模块与我的应用程序捆绑在一起时为每个模块设置单独的命名空间吗？

捆绑JSPM很简单,这是一个简单的任务:

var exec = require('child_process').exec;

gulp.task('jspmBuild', function (cb) {
        exec('jspm bundle-sfx src/app/app.js dist/app.min.js --skip-source-maps', function (err, stdout, stderr) {
            cb(err);
        });
    });

我想做的是,有两个单独的包,一个用于供应商文件,另一个用于实际应用.

那可能吗？

在尝试让Angular(1.x)使用​​systemjs时,我意识到目前没有能力(我知道)自动插入$inject到角度组件中,即使函数的参数受到损坏,这也会使组件保持工作状态.缩小器.手动创建$inject注释很繁琐,容易出错并且违反了DRY主体.

有一个成熟的npm模块ng-annotate,它可以解决这个问题并在许多类似的情况下用于捆绑.正如我一直在探索SystemJS,我发现有一个插件系统包含翻译源代码的能力,这正是ng-annotate它的作用.

但是,从我所看到的,SystemJS只能让您将特定文件扩展名映射到单个加载器,并且所有插件示例都支持新的文件类型.我想做的是对SystemJS的转换过程的输出进行后处理,而不是添加新的文件类型.似乎SystemJS应该能够做到这一点,因为它有一个处理管道,但我无法弄清楚如何以正确的方式挂钩它.现在我使用Browserify来达到同样的效果,但我最终得到了一组相当复杂的构建任务,如果可能的话我想用SystemJS简化它.

其他策略也可以ng-annotate在SystemJS的加载器管道中使用.

我使用JSPM和Typescript作为Angular2项目,Webstorm 11似乎对TS类的导入路径感到困惑.

第一个导入是正确的:

import {Component} from "angular2/core";

但是其他两个直接从jspm_packages导入这两个路径的文件夹直接引用:

import {Component} from "../../jspm_packages/npm/angular2@2.0.0-beta.0/src/core/metadata";
import {Component} from "../../jspm_packages/npm/angular2@2.0.0-beta.0/ts/src/core/metadata";

我忽略了这两个node_modules和jspm_packages在tsconfig.json作为Webstorm似乎认识到它,但至今没有运气.

有什么方法可以配置Webstorm自动导入正确的模块而忽略其他两个？

因此,我在将jspm包导入typescript时发现的大多数示例都假设我想使用Systemjs在浏览器中加载和解释它们.但是,我宁愿使用tsc构建commonjs模块并只导入js代码,因为在我看来,对我来说,这是更通用和反差的方法.

所以我的目录结构如下所示:

src/index.ts
jspm_packages/...
config.js
tsconfig.json

使用tsconfig具有以下内容:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "rootDir": "src",
    "outDir": "target/app",
    "sourceMap": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "declaration": true
  },
  "exclude": [
    "jspm_packages",
    "node_modules",
    "typings",
    "target"
  ]
}

出于测试目的,我安装了角度2 jspm install npm:angular2并试图在我的index.ts通道中导入它import { bootstrap } from 'angular2/platform/browser';

运行时tsc,我收到错误

src/index.ts(1,27): error TS2307: Cannot find module 'angular2/platform/browser'.

现在我想知道,我可以使用打字稿知道jspm包吗？我觉得我尝试了一切,从tsconfig排除列表中删除了jspm_packages,切换到节点模块解析或systemjs模块生成.也许我还没找到合适的组合.关于下一步尝试的任何提示？

我有一个JSPM/Typescript/Angular 1.5.3项目.我想使用新的组件路由器.在我的项目目录中,我使用了该命令

jspm install npm:@angular/router

哪个安装正常,没有错误.然后我把它添加到我的app.ts文件中

import ngComponentRouter from 'jspm_packages/npm/@angular/router@0.2.0/angular1/angular_1_router'

但是当我开始我的时候lite-server,我明白了

Failed to load resource: the server responded with a status of 404 (Not Found) 
http://localhost:3000/jspm_packages/npm/@angular/instruction.json

Failed to load resource: the server responded with a status of 404 (Not Found) 
http://localhost:3000/jspm_packages/npm/@angular/utils.json

Failed to load resource: the server responded with a status of 404 (Not Found) 
http://localhost:3000/jspm_packages/npm/@angular/url_parser.json

我不确定为什么要加载这些神秘的JSON文件,所以我检查了我的package.json:

{
  "jspm": {
    "name": "app",
    "dependencies": {
      "": "npm:@angular/router@^0.2.0",
      "angular": "npm:angular@^1.5.3", 

嗯......空的""看起来不对劲.如果JSPM无法解析包名并且路由器要求JSON文件,我觉得缺少构建步骤.我在这做错了什么？

我不确定我在这里缺少什么。我正在使用jspm和es6-module-loader进行项目。我有一个定义如下的模块：

import hooks from './hooks';
import api from './api';
import tools from './tools';

const StencilUtils = {
    hooks: hooks,
    api: api,
    tools: tools,
};

export {hooks, api, tools};
export default StencilUtils;

/* global define */
(function(root) {
    if (typeof define === 'function' && define.amd) {
        define(function() {
            return (root.stencilUtils = StencilUtils);
        });
    } else if (typeof module === 'object' && module.exports) {
        module.exports = StencilUtils;
    } else {
        window.stencilUtils = StencilUtils;
    }
}(this));

我将此模块导入另一个文件，并像这样使用它：

import utils from 'bigcommerce/stencil-utils';

utils.hooks.on('cart-item-add', (event, …

这不是一个编码问题，而是一个过程问题。

我正在构建的软件可能需要针对某些市场或一般市场进行发布后修复或添加功能。

遵循SemVer 2.0（http://semver.org/spec/v2.0.0-rc.2.html）将-标签附加到指定版本号进行标记的方案我想将标签添加+到版本号进行标记这样的发布后版本。

只要不发生重大更改，就会产生以下版本树：

1.0.1-rc1                               // initial pre-release
|
1.0.1-rc2                               // second pre-release
|
1.0.1                                   // actual release
|
|-------- 1.0.1+1 --- 1.0.1+2           // post release path
|
|
|
1.0.2                                   //non breaking
|
2.1.0                                   //1st breaking

有没有更好的方法来完全兼容 semver？

npm、jspm 和yarn 将如何处理这样的 semVer 扩展？

我是不是少了一块？有“官方”解决方案吗？