I have made a js script that allows me to send data to a database and I would like to import it into my .vue file so that I can use it when I click on a button. The problem is that Vue is showing me this error when I have the script imported and nothing is displayed on the page:
warning in ./src/views/Journal.vue?vue&type=script&lang=js&
"export 'default' (imported as 'mod') was not found in '-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Journal.vue?vue&type=script&lang=js&'
my js script :
const mysql = require("mysql");
async function main(userID, text) {
const connection = mysql.createConnection({
host: "",
user: "",
password: "",
database: "",
});
connection.connect(function (err) {
if (err) throw err;
console.log("Connected!");
var sql = `INSERT INTO 'journal' ('userID', 'journalTXT') VALUES ('${userID}', '${text}')`;
connection.query(sql, function (err) {
if (err) throw err;
console.log("1 record inserted");
connection.destroy();
});
});
}
main();
my vue page :
<template>
<div class="about" v-if="!$auth.isAuthenticated">
<h1>Bienvenue sur ton journal</h1>
<h2>Continue d'écrire ce qu'il te passe par la tête</h2>
<v-container fluid>
<v-row>
<v-col cols="7" sm="12">
<v-form>
<v-textarea
id="textarea"
counter
placeholder="Commence à écrire quelque chose ici "
label="Mon journal"
v-model="journal_txt"
></v-textarea>
</v-form>
</v-col>
</v-row>
<br />
<v-btn elevation="2" x-large v-on:click="dataExport(journal_txt)"
>Sauvegarder mon travail</v-btn
>
</v-container>
</div>
</template>
<script>
import main from "@/sendToDB.js";
module.exports = {
data: function () {
return {
journal_txt: "",
};
},
methods: {
dataExport: function (txt) {
main.main("1", txt);
},
},
};
</script>
If anyone has the solution, I'll gladly take it ;)
mainfunction being exported in your example.module.exports? or a simpleexport default?