lesca-facebook-share
Advanced tools
Comparing version 1.0.6 to 1.0.7
119
package.json
{ | ||
"name": "lesca-facebook-share", | ||
"version": "1.0.6", | ||
"description": "Simple facebook share", | ||
"main": "lib/index.js", | ||
"scripts": { | ||
"start": "webpack-dev-server --mode development", | ||
"watch": "babel src/lib -w -d lib --copy-files", | ||
"op": "babel src/lib -d lib --copy-files", | ||
"dev": "concurrently \"npm run watch\" \"npm run start\"", | ||
"rm": "rm -rf node_modules/ package-lock.json", | ||
"deploy": "gh-pages -d dist", | ||
"docs:prod": "webpack --mode production", | ||
"build": "NODE_ENV=production webpack" | ||
}, | ||
"keywords": [ | ||
"lesca", | ||
"衝康吉", | ||
"jameshsu1125", | ||
"Facebook share" | ||
], | ||
"license": "MIT", | ||
"devDependencies": { | ||
"@babel/cli": "^7.16.8", | ||
"@babel/core": "^7.16.12", | ||
"@babel/plugin-proposal-class-properties": "^7.16.7", | ||
"@babel/plugin-proposal-object-rest-spread": "^7.16.7", | ||
"@babel/plugin-transform-runtime": "^7.16.10", | ||
"@babel/preset-env": "^7.16.11", | ||
"@babel/preset-react": "^7.16.7", | ||
"autoprefixer": "^10.4.2", | ||
"babel-loader": "^8.2.3", | ||
"concurrently": "^7.0.0", | ||
"css-loader": "^6.5.1", | ||
"file-loader": "^6.2.0", | ||
"gh-pages": "^3.2.3", | ||
"html-webpack-plugin": "^5.5.0", | ||
"less": "^4.1.2", | ||
"less-loader": "^10.2.0", | ||
"postcss": "^8.4.5", | ||
"postcss-loader": "^6.2.1", | ||
"react": "^17.0.2", | ||
"react-dom": "^17.0.2", | ||
"style-loader": "^3.3.1", | ||
"webpack": "^5.67.0", | ||
"webpack-cli": "^4.9.2", | ||
"webpack-dev-server": "^4.7.3" | ||
}, | ||
"author": "jamehsu1125 <jameshsu1125@gmail.com>", | ||
"homepage": "https://github.com/jameshsu1125/lesca-facebook-share", | ||
"repository": { | ||
"type": "git", | ||
"url": "git@github.com:jameshsu1125/lesca-facebook-share.git" | ||
}, | ||
"dependencies": { | ||
"mobile-detect": "^1.4.5", | ||
"html-react-parser": "^1.4.5", | ||
"prismjs": "^1.26.0" | ||
} | ||
"name": "lesca-facebook-share", | ||
"version": "1.0.7", | ||
"description": "Simple facebook share", | ||
"main": "lib/index.js", | ||
"scripts": { | ||
"start": "webpack-dev-server --mode development", | ||
"watch": "babel src/lib -w -d lib --copy-files", | ||
"op": "babel src/lib -d lib --copy-files", | ||
"dev": "concurrently \"npm run watch\" \"npm run start\"", | ||
"rm": "rm -rf node_modules/ package-lock.json", | ||
"deploy": "gh-pages -d dist", | ||
"docs:prod": "webpack --mode production", | ||
"build": "NODE_ENV=production webpack" | ||
}, | ||
"keywords": [ | ||
"lesca", | ||
"衝康吉", | ||
"jameshsu1125", | ||
"Facebook share" | ||
], | ||
"license": "MIT", | ||
"devDependencies": { | ||
"@babel/cli": "^7.17.6", | ||
"@babel/core": "^7.17.9", | ||
"@babel/plugin-proposal-class-properties": "^7.16.7", | ||
"@babel/plugin-proposal-object-rest-spread": "^7.17.3", | ||
"@babel/plugin-transform-runtime": "^7.17.0", | ||
"@babel/preset-env": "^7.16.11", | ||
"@babel/preset-react": "^7.16.7", | ||
"@emotion/react": "^11.9.0", | ||
"@emotion/styled": "^11.8.1", | ||
"@mui/icons-material": "^5.6.0", | ||
"@mui/material": "^5.6.0", | ||
"autoprefixer": "^10.4.4", | ||
"babel-loader": "^8.2.4", | ||
"concurrently": "^7.1.0", | ||
"css-loader": "^6.7.1", | ||
"file-loader": "^6.2.0", | ||
"gh-pages": "^3.2.3", | ||
"html-webpack-plugin": "^5.5.0", | ||
"less": "^4.1.2", | ||
"less-loader": "^10.2.0", | ||
"postcss": "^8.4.12", | ||
"postcss-loader": "^6.2.1", | ||
"react": "^18.0.0", | ||
"react-dom": "^18.0.0", | ||
"style-loader": "^3.3.1", | ||
"less-vars-to-js": "^1.3.0", | ||
"webpack": "^5.71.0", | ||
"webpack-cli": "^4.9.2", | ||
"webpack-dev-server": "^4.8.1", | ||
"html-react-parser": "^1.4.10", | ||
"prismjs": "^1.27.0", | ||
"mobile-detect": "^1.4.5" | ||
}, | ||
"author": "jamehsu1125 <jameshsu1125@gmail.com>", | ||
"homepage": "https://github.com/jameshsu1125/lesca-facebook-share", | ||
"repository": { | ||
"type": "git", | ||
"url": "git@github.com:jameshsu1125/lesca-facebook-share.git" | ||
} | ||
} |
@@ -1,3 +0,15 @@ | ||
[![dev by JamesHsu](https://img.shields.io/badge/Dev%20by-Jameshsu1125-green)](https://github.com/jameshsu1125/) [![made in Taiwan](https://img.shields.io/badge/Made%20in-Taiwan-orange)](https://github.com/jameshsu1125/) [![npm](https://img.shields.io/badge/npm-Jameshsu1125-red)](https://www.npmjs.com/~jameshsu1125) | ||
[![NPM](https://img.shields.io/badge/NPM-ba443f?style=for-the-badge&logo=npm&logoColor=white)](https://www.npmjs.com/) | ||
[![React](https://img.shields.io/badge/Node.js-43853D?style=for-the-badge&logo=node.js&logoColor=white)](https://nodejs.org/en/) | ||
[![React](https://img.shields.io/badge/-ReactJs-61DAFB?style=for-the-badge&logo=react&logoColor=white)](https://zh-hant.reactjs.org/) | ||
[![React](https://img.shields.io/badge/Less-1d365d?style=for-the-badge&logo=less&logoColor=white)](https://lesscss.org/) | ||
[![React](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white)](https://www.w3schools.com/html/) | ||
[![React](https://img.shields.io/badge/-CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white)](https://www.w3schools.com/css/) | ||
[![NPM](https://img.shields.io/badge/DEV-Jameshsu1125-9cf?style=for-the-badge)](https://www.npmjs.com/~jameshsu1125) | ||
# Why use it? | ||
It use for share url to Facebook simply. | ||
#### [Live Demo](https://jameshsu1125.github.io/lesca-facebook-share/) | ||
# Installation | ||
@@ -9,38 +21,43 @@ | ||
# Demo | ||
## Usage | ||
[Live Demo](https://jameshsu1125.github.io/lesca-facebook-share/) | ||
install before DOM Render | ||
# Usage | ||
```javascript | ||
import Facebook from 'lesca-facebook-share'; | ||
// run install in entry file. | ||
Facebook.install('facebook-app-id'); // get one => https://developers.facebook.com/apps/ | ||
Facebook.install('facebook-app-id'); // get your id => https://developers.facebook.com/apps/ | ||
``` | ||
share with parameters | ||
```javascript | ||
import Facebook from 'lesca-facebook-share'; | ||
Facebook.share({ | ||
url: 'https://github.com/jameshsu1125/lesca-facebook-share', | ||
quote: 'use share facebook api simply', | ||
hashtag: 'lesca_facebook_share', | ||
redirect_uri: window.location.href, | ||
}); | ||
``` | ||
function share() { | ||
Facebook.share({ | ||
url: 'https://github.com/jameshsu1125/lesca-facebook-share', | ||
quote: 'use share facebook api simply', | ||
hashtag: 'lesca_facebook_share', | ||
redirect_uri: window.location.href, | ||
}); | ||
} | ||
## Development | ||
<button onClick={share}>share to facebook</button>; | ||
``` | ||
### Methods | ||
# Methods | ||
| method | description | return | | ||
| :--------------------------------------------------------------------------------------------------- | :---------------------------: | -----: | | ||
| .install(uid: _string_) | initialize with uid | void | | ||
| .share({ **url**: _string_, **hashtag**: _string_, **quote**: _string_, **redirect_url**: _string_}) | [parmaters](#share-parmaters) | | | ||
| method | options | description | default | | ||
| :-------------------------------------------- | :----------: | :--------------------------------: | ------------: | | ||
| .install(uid) | uid | install FB.js with facebook app id | | | ||
| .share({ url, hashtag, quote, redirect_uri }) | url | The URL you want to share | | | ||
| | hashtag | with hashtag | | | ||
| | quote | with quote | | | ||
| | redirect_uri | mobile device necessary | location root | | ||
#### share parmaters | ||
| parmaters | description | default | | ||
| :------------------------- | :---------------------------------: | ------------: | | ||
| **url**: _string_ | share url | | | ||
| **hashtag**: _string_ | hashtag | void | | ||
| **quote**: _string_ | quote | void | | ||
| **redirect_url**: _string_ | redirect url (**mobile necessary**) | location.href | | ||
### Features | ||
- maintain if necessary |
@@ -1,59 +0,35 @@ | ||
import { render } from 'react-dom'; | ||
import { Navation, Code } from './components'; | ||
import Demo from './demo'; | ||
import Facebook from '../lib/index'; | ||
import { Container } from '@mui/material'; | ||
import { ThemeProvider } from '@mui/material/styles'; | ||
import { useState } from 'react'; | ||
import { createRoot } from 'react-dom/client'; | ||
import Navigation from './components/navigation'; | ||
import Demo from './pages/demo'; | ||
import Usage from './pages/usage'; | ||
import './styles.less'; | ||
import { theme } from './theme'; | ||
const homepage = 'https://github.com/jameshsu1125/lesca-facebook-share'; | ||
const name = 'lesca-facebook-share'; | ||
const description = 'simple facebook share'; | ||
const code = `import Facebook from 'lesca-facebook-share'; | ||
const App = () => { | ||
const [state, setState] = useState('demo'); | ||
Facebook.install('facebook-app-id'); // => https://developers.facebook.com/apps/ | ||
`; | ||
const appendPage = () => { | ||
switch (state) { | ||
default: | ||
case 'demo': | ||
return <Demo />; | ||
const code2 = `import Facebook from 'lesca-facebook-share | ||
case 'usage': | ||
return <Usage />; | ||
} | ||
}; | ||
const share = () => { | ||
Facebook.share({ | ||
url: 'https://github.com/jameshsu1125/lesca-facebook-share', | ||
quote: 'use share facebook api simply', | ||
hashtag: 'lesca_facebook_share', | ||
}); | ||
}; | ||
return <button onClick={share}>Facebook Share</button> | ||
`; | ||
Facebook.install('171368189560011'); | ||
const Page = () => { | ||
return ( | ||
<> | ||
<Navation /> | ||
<div className='content'> | ||
<div> | ||
<h1>{name}</h1> | ||
<figcaption>{description}</figcaption> | ||
</div> | ||
<div> | ||
<h2>install</h2> | ||
<Code code={`npm install ${name} --save`} theme='markup' /> | ||
</div> | ||
<div> | ||
<h2>run install on entry file</h2> | ||
<Code code={code} /> | ||
<h2>share your url with parameters</h2> | ||
<Code code={code2} theme='javascript' /> | ||
<Demo /> | ||
</div> | ||
<div> | ||
<h2>Usage</h2> | ||
<a href={homepage}>Documentation</a> | ||
</div> | ||
</div> | ||
</> | ||
<ThemeProvider theme={theme}> | ||
<Navigation setState={setState} state={state} /> | ||
<Container style={{ paddingTop: '70px' }} maxWidth='lg'> | ||
{appendPage()} | ||
</Container> | ||
</ThemeProvider> | ||
); | ||
}; | ||
render(<Page />, document.getElementById('app')); | ||
createRoot(document.getElementById('app')).render(<App />); |
const path = require('path'); | ||
const HtmlWebpackPlugin = require('html-webpack-plugin'); | ||
const Meta = require('./template/template.meta'); | ||
module.exports = { | ||
entry: path.join(__dirname, 'src/docs'), | ||
output: { | ||
path: path.join(__dirname, 'dist'), | ||
filename: 'bundle.js', | ||
}, | ||
module: { | ||
rules: [ | ||
{ test: /\.(js|jsx)$/, use: 'babel-loader', exclude: /node_modules/ }, | ||
{ test: /\.css$/, use: ['style-loader', 'css-loader', 'postcss-loader'] }, | ||
{ test: /\.less$/, use: ['style-loader', 'css-loader', 'postcss-loader', 'less-loader'] }, | ||
{ | ||
test: /\.(png|jpg|gif|svg)$/, | ||
use: [{ loader: 'file-loader', options: { name: 'img/[path][name].[ext]', context: 'src/docs' } }], | ||
}, | ||
], | ||
}, | ||
plugins: [ | ||
new HtmlWebpackPlugin({ | ||
template: path.join(__dirname, 'src/docs/index.html'), | ||
}), | ||
], | ||
resolve: { | ||
extensions: ['.js', '.jsx'], | ||
}, | ||
devServer: { | ||
port: 8000, | ||
https: true, | ||
}, | ||
entry: path.join(__dirname, 'src/docs'), | ||
output: { | ||
path: path.join(__dirname, 'dist'), | ||
filename: 'bundle.js', | ||
}, | ||
module: { | ||
rules: [ | ||
{ test: /\.(js|jsx)$/, use: 'babel-loader', exclude: /node_modules/ }, | ||
{ test: /\.css$/, use: ['style-loader', 'css-loader', 'postcss-loader'] }, | ||
{ test: /\.less$/, use: ['style-loader', 'css-loader', 'postcss-loader', 'less-loader'] }, | ||
{ | ||
test: /\.(png|jpg|gif|svg)$/, | ||
use: [ | ||
{ | ||
loader: 'file-loader', | ||
options: { name: 'img/[path][name].[ext]', context: 'src/docs' }, | ||
}, | ||
], | ||
}, | ||
], | ||
}, | ||
plugins: [ | ||
new HtmlWebpackPlugin({ | ||
...Meta, | ||
template: 'template/template.html', | ||
}), | ||
], | ||
resolve: { | ||
extensions: ['.js', '.jsx'], | ||
}, | ||
devServer: { | ||
port: 8000, | ||
https: true, | ||
}, | ||
}; |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
21750
0
27
412
63
32
- Removedhtml-react-parser@^1.4.5
- Removedmobile-detect@^1.4.5
- Removedprismjs@^1.26.0
- Removeddom-serializer@1.4.1(transitive)
- Removeddomelementtype@2.3.0(transitive)
- Removeddomhandler@4.3.1(transitive)
- Removeddomutils@2.8.0(transitive)
- Removedentities@2.2.03.0.1(transitive)
- Removedhtml-dom-parser@1.2.0(transitive)
- Removedhtml-react-parser@1.4.14(transitive)
- Removedhtmlparser2@7.2.0(transitive)
- Removedinline-style-parser@0.1.1(transitive)
- Removedjs-tokens@4.0.0(transitive)
- Removedloose-envify@1.4.0(transitive)
- Removedmobile-detect@1.4.5(transitive)
- Removedprismjs@1.29.0(transitive)
- Removedreact@18.3.1(transitive)
- Removedreact-property@2.0.0(transitive)
- Removedstyle-to-js@1.1.1(transitive)
- Removedstyle-to-object@0.3.0(transitive)