I create my first npm package. I published it on npmjs and encountered the error of the lack of the 'postcss-import' module after installing the package in the project and running it. Tell me, where and in which file may the problem be? I tried all the ways and nothing works.Maybe something is wrong with these files?
This is the 'package.json' file of my package
{
"_from": "some_package",
"_inBundle": false,
"_integrity": "sha512-***",
"_location": "/some_package",
"_phantomChildren": {},
"_requested": {
"type": "tag",
"registry": true,
"raw": "some_package",
"name": "some_package",
"escapedName": "some_package",
"rawSpec": "",
"saveSpec": null,
"fetchSpec": "latest"
},
"_requiredBy": [
"#USER",
"/"
],
"_resolved": "https://registry.npmjs.org/some_package/-/some_package-1.0.1.tgz",
"_shasum": "***",
"_spec": "some_package",
"_where": "/home/user/vue/projects/package_name",
"author": "",
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
],
"bundleDependencies": false,
"dependencies": {
"vue": "^2.6.5",
"vue-browser-detect-plugin": "^0.1.5",
"vue-element-resize-event": "^0.1.0"
},
"deprecated": false,
"description": "A Vue.js project",
"devDependencies": {
"postcss-import": "^11.0.0",
"postcss-loader": "^2.1.6",
"postcss-url": "^7.2.1"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"license": "ISC",
"main": "src/main.js",
"name": "some_package",
"private": false,
"scripts": {
"build": "node build/build.js",
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev"
},
"version": "1.0.8",
"repository": {
"type": "git",
"url": "git+https://github.com/user/some_package.git"
},
"bugs": {
"url": "https://github.com/user/some_package/issues"
},
"homepage": "https://github.com/user/some_package#readme"
}
This is the '.postcssrc.js' file of my package
module.exports = {
"plugins": {
"postcss-import": {},
"postcss-url": {},
// to edit target browsers: use "browserslist" field in package.json
"autoprefixer": {}
}
}
You can try:
npm install --save-dev postcss-import
Related
I'm trying to figure out what is wrong with my package.json, does anyone have any ideas?
{
"name": "greeting",
"version": "1.0.0",
"description": "Testing Hello World",
"main": "hello.js",
"dependencies": {
"course-utilities": "^1.0.0",
"crashtravel-preprod-v2-utilities": "^1.0.0",
"jest": "^26.1.0"
},
"devDependencies": {},
"scripts": {
"test": "jest"
},
"author": "abel#mit.edu",
"license": "MIT",
"bugs": {
"url": "https://github.com/kogsio/greeting/issues"
},
"homepage": "https://github.com/kogsio/greeting#readme"
}
Attempting to create a new vue project. I run:
yarn global add #vue/cli
vue create my-project
Then:
cd my-project
yarn serve
Right out of the gate I'm getting an error that I cannot resolve:
Cannot find module '#babel/preset-env/data/built-ins.json
In the auto-generated package.json (below) #babel/preset-env isn't listed as a dev dependency, but I assume it gets added automatically as a dependency of some of the vue stuff? Any idea what is going on?
Here are auto-generated files:
package.json
{
"name": "my-project",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"vue": "^2.6.6"
},
"devDependencies": {
"#vue/cli-plugin-babel": "^3.5.0",
"#vue/cli-plugin-eslint": "^3.5.0",
"#vue/cli-service": "^3.5.0",
"babel-eslint": "^10.0.1",
"eslint": "^5.8.0",
"eslint-plugin-vue": "^5.0.0",
"vue-template-compiler": "^2.5.21"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
babel.config.js
module.exports = {
presets: [
'#vue/app'
]
}
What are the steps to follow publish React-native component to npm?
Am trying to publish sample component in NPM.
Do we need to build that before?
if yes, how?
Please can any one tell in detail along with the commands?
No you no need to build, just put android native code in android and ios directory and a index.js in root to refreance them, then
Add readme
give proper versioning
give proper name
Like this in package.json
{
"_from": "package-name#0.1.3",
"_id": "package-name#0.1.3",
"_inBundle": false,
"_location": "/package-name",
"_phantomChildren": {},
"_requested": {
"type": "version",
"registry": true,
"raw": "package-name#0.1.3",
"name": "package-name",
"escapedName": "package-name",
"rawSpec": "0.1.3",
"saveSpec": null,
"fetchSpec": "0.1.3"
},
"_requiredBy": [
"/"
],
"_spec": "0.1.3",
"author": {
"name": "Your name",
"email": "your#gmail.com"
},
"bugs": {
"url": "https://github.com/bug/issues"
},
"dependencies": {
"prop-types": "^15.6.0"
},
"description": "description about pacakge",
"homepage": "https://github.com/#readme",
"keywords": [
"react-native",
"react",
"dnd"
],
"license": "MIT",
"main": "index.js",
"name": "package-name",
"peerDependencies": {},
"repository": {
"type": "git",
"url": "git+https://github.com/package-name.git"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"version": "0.1.3"
}
Trying to get Jest v12.1.1 working with React Native v0.26.2 I'm getting this error when run npm test:
Error: Cannot find module 'ErrorUtils' from 'env.js'
Here's my package.json. I'm trying to get this working with the default react-native init AwesomeProject starter.
Is there something missing from my package.json? (are here any lines I don't need?)
EXAMPLE 1:
package.json
{
"name": "AwesomeProject",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"react": "^15.0.2",
"react-native": "^0.26.2"
},
"devDependencies": {
"babel-jest": "^9.0.0",
"babel-preset-es2015": "*",
"babel-preset-react": "*",
"jest-cli": "^12.1.1"
},
"scripts": {
"test": "jest"
},
"jest": {
"scriptPreprocessor": "node_modules/react-native/jestSupport/preprocessor.js",
"setupEnvScriptFile": "node_modules/react-native/jestSupport/env.js",
"testPathIgnorePatterns": [
"/node_modules/",
"/android/",
"/ios/",
"/.idea/"
],
"testFileExtensions": [
"js"
],
"unmockedModulePathPatterns": [
"<rootDir>/node_modules/react/",
"<rootDir>/node_modules/react-dom/",
"<rootDir>/node_modules/react-addons-test-utils/"
],
"verbose": true
}
}
Here's a test script.
index.android-test.js
// __tests__/index.android-test.js
'use strict';
jest
.disableAutomock()
.setMock('AwesomeProject', {})
.setMock('React', {Component: class {}});
describe('AwesomeProject', () => {
it('test something', () => {
const testJunk = true;
expect(testJunk).toEqual(true);
});
});
EXAMPLE 2:
I get a different error when I add "haste" to package.json and remove scriptPreprocessor & setupEnvScriptFile.
Error: Cannot find module 'AwesomeProject' from 'index.android-test.js'
I have no clue why I get farther ahead with the following. My previous Example 1 is following:
https://facebook.github.io/jest/docs/tutorial-react.html#content
And Example 2 with 'haste` is following:
https://github.com/fbsamples/f8app/blob/master/package.json
Really confused about why Ex 1 doesn't work.
revised package.json
{
"name": "AwesomeProject",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start"
},
"dependencies": {
"react": "^15.0.2",
"react-native": "^0.26.2"
},
"devDependencies": {
"babel-jest": "^9.0.0",
"babel-preset-es2015": "*",
"babel-preset-react": "*",
"jest-cli": "^12.1.1"
},
"scripts": {
"test": "jest"
},
"jest": {
"haste": {
"defaultPlatform": "android",
"platforms": [
"ios",
"android"
],
"providesModuleNodeModules": [
"react-native"
]
},
"testPathIgnorePatterns": [
"/node_modules/",
"/android/",
"/ios/",
"/.idea/"
],
"testFileExtensions": [
"js"
],
"unmockedModulePathPatterns": [
"<rootDir>/node_modules/react/",
"<rootDir>/node_modules/react-dom/",
"<rootDir>/node_modules/react-addons-test-utils/"
],
"verbose": true
}
}
When I try to run browserify I get the following error:
Trace
at /test/node_modules/browserify-shim/lib/resolve-shims.js:216:17
at /test/node_modules/browserify-shim/node_modules/find-parent-dir/index.js:16:26
at Object.cb [as oncomplete] (fs.js:168:19)
Error: Cannot find module 'package.json'
What my test folder looks like
/test
->/node_modules
->index.js
->jquery.js
->package.json
What my package.json looks like
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "./index.js",
"browser": {
"jquery": "./jquery.js"
},
"browserify": {
"transform": [
"browserify-shim"
]
},
"browserify-shim": {
"jquery": "$"
},
"repository": "",
"author": "",
"devDependencies": {
"browserify": "^3.30.2",
"browserify-shim": "^3.2.2"
}
}
Any ideas?