Q&A
サーバーサイドJSと クライアントサイドJS を理解してないように見える
前提・実現したいこと
Store.jsを使ってローカルストレージにデータを保存できるようにしようと思っていますが、以下のエラーメッセージが出てしまします。下部の 「試したこと」項目に記載した事を試したのですが、エラーが消えないのでご質問しました。
発生している問題・エラーメッセージ
Uncaught ReferenceError: require is not defined
該当のソースコード
index.html
1<body> 2<script src="path/to/my/store.legacy.min.js"></script> 3<script> 4 var store = require('store'); 5 store.set('user', {name:'Marcus'}); 6 store.get('user').name == 'Marcus'; 7</script> 8</body>
試したこと
■ 以下の２つgoogleで検索して出てきた情報を試しました。
・該当のソースコードにも書いてありますが、<script src="path/to/my/store.legacy.min.js"></script> を直線で呼び出す。
・(該当のソースコード）に記載したコード <script></script> の処理を test1.js に切り出して、以下のコマンドを実行し、出来上がった bundle.js を <head></head> のはじめに呼ぶ。
browserify ./src/test1.js -o bundle.js
最低限の情報として、環境やバージョンを記載しましょう。エラーはどこから出ているのでしょうか？
回答2件
0
requireはそのままではほぼブラウザでは使えないです。store.legacy.min.jsをscriptタグで読み込んだ上でrequireを省略して動きませんか？以下の例ではとりあえずCDNから読むようにしています。
html
1<script src='https://cdn.jsdelivr.net/npm/store-js@2.0.4/dist/store.legacy.min.js'></script> 2<script> 3 store.set('user', {name:'Marcus'}); 4 store.get('user').name == 'Marcus'; 5</script> 6
投稿2018/06/02 15:39
編集2018/06/02 15:40
総合スコア640
0
path/to/my/ の部分をご自身の環境に合わせて書き直してみてください。
投稿2018/06/02 15:36
総合スコア69407
多分 npm かなにかの書き方をブラウザでしたいんだとおもうじょ
https://getbootstrap.com/docs/4.1/getting-started/download/#npm
To: asahina1979さん
【GitHub - marcuswestin/store.js: Cross-browser storage for all use cases, used across the web.】
https://github.com/marcuswestin/store.js/#supported-browsers
// Example store.js usage with npm
var store = require('store')
store.set('user', { name:'Marcus' })
store.get('user').name == 'Marcus'
<!-- Example store.js usage with script tag -->
<script src="path/to/my/store.legacy.min.js"></script>
<script>
store.set('user', { name:'Marcus' })
store.get('user').name == 'Marcus'
</script>
前者：NPM(サーバーサイドJS)
後者：ブラウザ上での動作
だね
あなたの回答
tips
プレビュー
