Question

您好，感谢您阅读本文。

我想在本地WebStorm IDE中加载示例。特别是我试图加载加载器示例： https://github.com/FNNDSC/ami/tree/dev/examples/viewers_upload

我得到的问题是默认导入看起来没有正确设置：

所以，如果我尝试运行npm install

我收到此错误：

Can not install Node.js module: "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" install base/core/core.utils

Standard error:
npm ERR! code ENOLOCAL
npm ERR! Could not install from "base\core\core.utils" as it does not contain a package.json file.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\YonePC\AppData\Roaming\npm-cache\_logs\2018-01-16T18_50_29_864Z-debug.log

我认为它与我的package.json有关，但看起来它已经设置了所有依赖项：

{
    "name": "ami.js",
    "version": "0.0.23-dev",
    "main": "build/ami.js",
    "keywords": [
        "ami",
        "ami.js",
        "three.js",
        "webgl",
        "dicom",
        "nifti",
        "awesome",
        "medical",
        "imaging",
        "xtk",
        "nrrd",
        "vtk",
        "stl",
        "trk"
    ],
    "author": {
        "name": "Nicolas Rannou",
        "email": "nicolas@eunate.ch",
        "url": "https://eunate.ch"
    },
    "license": "Apache-2.0",
    "repository": {
        "type": "git",
        "url": "https://fnndsc.github.io/ami"
    },
    "config": {
        "threeVersion": "87",
        "amiCDN": "https://cdnjs.cloudflare.com/ajax/libs/ami.js",
        "gaKey": "UA-39303022-3",
        "babel": "--module-bind js=babel-loader --colors --display-error-details"
    },
    "dependencies": {
        "dicom-parser": "1.7.3",
        "image-JPEG2000": "OHIF/image-JPEG2000#master",
        "jpeg-lossless-decoder-js": "1.2.3",
        "math-float32-to-binary-string": "^1.0.0",
        "nifti-reader-js": "v0.5.3",
        "nrrd-js": "^0.2.1",
        "pako": "1.0.1",
        "three": "0.87.0"
    },
    "scripts": {
        "build:ami": "webpack --config webpack.config.build.js",
        "build:ami:prod": "cross-env NODE_ENV=production yarn build:ami",
        "build:clean": "rimraf -rf build/*",
        "build:clean:hot": "rimraf -rf build/*.hot-update.*",
        "dev:ami": "webpack --config webpack.config.build.js --hot --watch --colors",
        "dist:ami": "yarn build:clean && yarn build:ami && yarn build:ami:prod && yarn doc",
        "dist:examples": "node ./scripts/buildDist.js && node ./scripts/router.js examples deploy",
        "dist:clean": "rimraf -rf dist/*",
        "analyze:ami": "cross-env NODE_WEBPACK_ANALYZE=true yarn build:ami",
        "analyze:ami:prod": "cross-env NODE_WEBPACK_ANALYZE=true yarn build:ami:prod",
        "clean": "yarn build:clean && yarn dist:clean",
        "example": "node ./scripts/router.js examples",
        "lesson": "node ./scripts/router.js lessons",
        "gen:index:examples": "node ./scripts/genIndexFiles.js examples",
        "gen:index:examples:ga": "cross-env NODE_GA=true node ./scripts/genIndexFiles.js examples",
        "gen:index:lessons": "node ./scripts/genIndexFiles.js lessons",
        "gen:index:lessons:cdn": "node ./scripts/genIndexFiles.js lessons cdn",
        "test": "karma start",
        "lint": "eslint src/**/*.js",
        "doc": "jsdoc -p -r -R README.md -c jsdoc.json -d dist/doc src",
        "ami": "yarn lint && yarn dist:ami && yarn test",
        "deploy": "yarn dist:clean && yarn build:clean && yarn dist:ami && yarn dist:examples && gh-pages -d dist"
    },
    "devDependencies": {
        "babel-cli": "latest",
        "babel-core": "^6.26.0",
        "babel-loader": "^7.1.2",
        "babel-preset-env": "^1.6.0",
        "babel-runtime": "^6.26.0",
        "compression-webpack-plugin": "^1.0.1",
        "cross-env": "^3.2.3",
        "eslint": "latest",
        "eslint-config-google": "latest",
        "gh-pages": "latest",
        "glslify": "5.1.0",
        "jasmine-core": "latest",
        "jsdoc": "jsdoc3/jsdoc#master",
        "karma": "latest",
        "karma-chrome-launcher": "^2.2.0",
        "karma-jasmine": "latest",
        "karma-sinon": "^1.0.5",
        "karma-spec-reporter": "latest",
        "karma-webpack": "^2.0.4",
        "live-server": "^1.1.0",
        "puppeteer": "^0.13.0",
        "rimraf": "^2.6.1",
        "rollup-plugin-node-builtins": "^2.1.2",
        "shelljs": "latest",
        "sinon": "^2.0.0",
        "uglifyjs-webpack-plugin": "^1.0.0-beta.3",
        "webpack": "^3.7.1",
        "webpack-bundle-analyzer": "^2.9.0",
        "webpack-dev-server": "^2.9.1",
        "webpack-watch-livereload-plugin": "^0.0.1"
    },
    "engines": {
        "node": ">=6.9.0"
    }
}

此外，我查看并尝试查找是否有Node模块，但由于它没有出现在package.json中，因此默认情况下不会安装它们：

但是我确实安装了节点：

Microsoft Windows [Versión 6.3.9600]
(c) 2013 Microsoft Corporation. Todos los derechos reservados.

C:\Users\YonePC\WebstormProjects\ATLAS>node -v
v8.9.0

如果我执行index.html，它在开发者控制台上说：

'Uncaught SyntaxError: Unexpected identifier'

所说的话是：

import CoreUtils from 'base/core/core.utils';

如果我尝试使用IDE的帮助重做导入，则结果如下：

执行更新的index.html后：

viewers_upload.js:5 Uncaught SyntaxError: Unexpected identifier

引用的行是：

import HelpersLut from "../../src/helpers/helpers.lut";

如果我尝试使用网络CDN库版本：

我需要删除所有导入并使用Web库版本的类，如下所示：

我可以执行index.html并触发加载器：

但是我不能无限地执行它因为parseUrl的类在磁盘库上而不在Web库中：

控制台说：

'Uncaught ReferenceError: CoreUtils is not defined
    at HTMLInputElement.readMultipleFiles (viewers_upload.js:429)
readMultipleFiles @ viewers_upload.js:429'

你能帮我吗？

感谢您抽出时间阅读本文。

编辑：我仍然试图让这个例子在本地工作。到目前为止，我已经能够包含AMI库的文件链接，例如：

viewers_upload.js

let dataUrl = CoreUtils.parseUrl(evt.target.files[i].name);

而不是IDE生成的正常导入：

import CoreUtils from "../../src/core/core.utils";

使用直接加载：

index.html

<script src="../../src/core/core.utils.js"></script>

但是我无法继续这样做，因为core.utils.js使用import，因此浏览器报告错误：

Uncaught SyntaxError: Unexpected identifier

排队：

import Validators from './core.validators';

你能帮我吗???

Answer 1

要运行示例，您应该：

启动开发服务器：yarn example <example name>（在您的情况下为yarn example viewers_upload）
转到网络浏览器中的localhost:8081

Javascript试图在本地运行AMIjs示例它不起作用

1 个答案: