我创建自己的npm包并发布它,但当我尝试使用它时,它给了我一个错误

时间:2021-08-31 09:38:30

I create reactjs component and make it publish on npm . i install it in my another project and now when i try to import it giving full path such as

我创建reactjs组件并使其在npm上发布。我安装在我的另一个项目中,现在当我尝试导入它给出完整的路径,如

import RippleIcon from '../node_modules/rippleicon/src/RippleIcon';

it gives me an error that

它给了我一个错误

./node_modules/rippleicon/src/RippleIcon.js
Module parse failed: Unexpected token (10:8)
You may need an appropriate loader to handle this file type.
|   render() {
|     return (
|         <i className={this.props.icon+" RippleIcon"}/>
|     );
|   }

rippleicon is my npm package name, and i create my package on create-react-app. any suggestions are welcome. thank you.

rippleicon是我的npm包名,我在create-react-app上创建我的包。欢迎任何建议。谢谢。

this is my package.json

这是我的package.json

{
 "name": "packagetesting",
 "version": "0.1.0",
 "private": true,
 "dependencies": {
   "react": "^16.3.2",
   "react-dom": "^16.3.2",
   "react-scripts": "1.1.4",
   "rippleicon": "^0.1.1"
},
"scripts": {
  "start": "react-scripts start",
  "build": "react-scripts build",
  "test": "react-scripts test --env=jsdom",
  "eject": "react-scripts eject"
}
}

1 个解决方案

#1


1  

Creating a node package and link it to a project is relatively easy. Assuming you will have mypackage and myproject on the same path, try with this steps:

创建节点包并将其链接到项目相对容易。假设您将mypackage和myproject放在同一路径上,请尝试以下步骤:

1.- Package

1.-包装

$ mkdir mypackage
$ cd mypackage/
$ npm init -y
$ echo "exports.myfunc = function() { console.log(\"Hello\"); }" > index.js
$ cd ..

Its package.json content will be:

它的package.json内容将是:

{
  "name": "mypackage",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

2.- Project

2.-项目

$ mkdir myproject
$ cd myproject/
$ npm init -y
$ npm install "file:../mypackage" --save
$ echo "var mp = require('mypackage'); mp.myfunc();" > index.js
$ node index.js

You will see that "Hello" is printed. Its package.json content will be:

您将看到打印出“Hello”。它的package.json内容将是:

{
  "name": "myproject",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "mypackage": "file:../mypackage"
  }
}

#1


1  

Creating a node package and link it to a project is relatively easy. Assuming you will have mypackage and myproject on the same path, try with this steps:

创建节点包并将其链接到项目相对容易。假设您将mypackage和myproject放在同一路径上,请尝试以下步骤:

1.- Package

1.-包装

$ mkdir mypackage
$ cd mypackage/
$ npm init -y
$ echo "exports.myfunc = function() { console.log(\"Hello\"); }" > index.js
$ cd ..

Its package.json content will be:

它的package.json内容将是:

{
  "name": "mypackage",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

2.- Project

2.-项目

$ mkdir myproject
$ cd myproject/
$ npm init -y
$ npm install "file:../mypackage" --save
$ echo "var mp = require('mypackage'); mp.myfunc();" > index.js
$ node index.js

You will see that "Hello" is printed. Its package.json content will be:

您将看到打印出“Hello”。它的package.json内容将是:

{
  "name": "myproject",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "mypackage": "file:../mypackage"
  }
}