如何在Chrome扩展中导入npm包
如何在Chrome扩展中导入npm包
提问于 2022-03-16 10:34:11
我正在构建一个Chrome扩展，它使用从tensorflowjs加载的GraphModel。但是，我需要使用tensorflowjs包来使用函数tf.loadGraphModel导入我的模型。是否有方法将包导入到我的chrome扩展，以便我可以加载我的模型？谢谢。
回答 2
Stack Overflow用户
发布于 2022-03-16 10:47:56
首先运行npm init，以便您的文件夹中有package.json文件，然后安装所需的包(npm i [yourPackage])。
然后-您需要将路径添加到manifest.json中，例如，如果您正在使用content_scripts -您可以这样添加它：
"content_scripts": [
{
"matches": ["https://*/*"],
"js": [
"node_modules/axios/dist/axios.js",
"content-script.js"
]
}
]Stack Overflow用户
发布于 2022-03-16 10:53:31
您可以使用webpack，它是一个模块绑定器(这意味着它的主要目的是捆绑JavaScript文件，以便在浏览器中使用)。如果已经设置了npm，则可以在项目中执行以下命令：
npm install webpack完成之后，您可以继续设置npm包。您需要运行正确的npm命令。
npm install ...继续webpack的设置，您将需要创建一个webpack.config.js文件，并在那里设置条目和输出。您可以在网上找到大量教程，但下面是一个快速示例实现：
webpack.config.js：
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');
const path = require('path');
module.exports = {
mode: 'production',
entry: {
main: './src/main'
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist')
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/
},
{
test: /\.(png|svg|jpg|gif)$/,
use: [
'file-loader',
],
},
],
},
devServer: {
contentBase: './dist',
overlay: true,
hot: true
},
plugins: [
new CopyWebpackPlugin({
patterns: [
{ from: 'manifest.json', to: 'manifest.json' },
],
}),
new CopyWebpackPlugin({
patterns: [
{ from: 'images', to: 'images' },
],
}),
new CopyWebpackPlugin({
patterns: [
{ from: 'popup.html', to: 'popup.html' },
],
}),
new webpack.HotModuleReplacementPlugin()
],
};在输入文件(入口点)中，一旦这样做了，就可以使用tensorflowjs函数。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71495512
复制相关文章
相似问题
腾讯云开发者
