Unable to re-assign variable in webpack plugin using parser hook
up vote
0
down vote
favorite
I'm trying to re-assign a variable in a specific file dynamically based on passed in build arguments but I'm having trouble understanding the plugin documentation and figuring out where the place for me to wire this in would be.
The ideal scenario would be to be able to pass a file name, variable name, and variable value to the plugin (for brevity I've left out the constructor to take in these arguments), and then override/re-assign them in the given file.
I.e. Index.ts would have let myVariable = false;
, and I'd like to flip this to true based on passed in parameters to webpack.
With the below code, I can use the parser to find the variable, but I can't seem to change it. I've tried statement.declarations[0].init.raw = "true"
and statement.declarations[0].init.value = true
, but the output index.js file still has the original false value.
Am I trying to do this in the wrong part of the webpack process, or do I need to be using a different hook? Any guidance on how or where I could do this would be really helpful. Thanks.
class MyPlugin {
apply(compiler) {
compiler.hooks.beforeCompile.
tap('MyPlugin', ({ normalModuleFactory }) => {
normalModuleFactory.hooks.parser.
for("javascript/auto").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/dynamic").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/esm").
tap("MyPlugin", handler);
});
function handler(parser, options) {
parser.hooks.statement.tap('MyPlugin', (statement) => {
const module = parser.state.module;
if (module.resource
&& module.resource.endsWith('index.ts')
&& statement.type === 'VariableDeclaration'
&& statement.declarations[0].id.name === 'myVariable') {
// Do something here??
}
});
}
}
}
module.exports = MyPlugin;
webpack-4 webpack-plugin
add a comment |
up vote
0
down vote
favorite
I'm trying to re-assign a variable in a specific file dynamically based on passed in build arguments but I'm having trouble understanding the plugin documentation and figuring out where the place for me to wire this in would be.
The ideal scenario would be to be able to pass a file name, variable name, and variable value to the plugin (for brevity I've left out the constructor to take in these arguments), and then override/re-assign them in the given file.
I.e. Index.ts would have let myVariable = false;
, and I'd like to flip this to true based on passed in parameters to webpack.
With the below code, I can use the parser to find the variable, but I can't seem to change it. I've tried statement.declarations[0].init.raw = "true"
and statement.declarations[0].init.value = true
, but the output index.js file still has the original false value.
Am I trying to do this in the wrong part of the webpack process, or do I need to be using a different hook? Any guidance on how or where I could do this would be really helpful. Thanks.
class MyPlugin {
apply(compiler) {
compiler.hooks.beforeCompile.
tap('MyPlugin', ({ normalModuleFactory }) => {
normalModuleFactory.hooks.parser.
for("javascript/auto").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/dynamic").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/esm").
tap("MyPlugin", handler);
});
function handler(parser, options) {
parser.hooks.statement.tap('MyPlugin', (statement) => {
const module = parser.state.module;
if (module.resource
&& module.resource.endsWith('index.ts')
&& statement.type === 'VariableDeclaration'
&& statement.declarations[0].id.name === 'myVariable') {
// Do something here??
}
});
}
}
}
module.exports = MyPlugin;
webpack-4 webpack-plugin
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I'm trying to re-assign a variable in a specific file dynamically based on passed in build arguments but I'm having trouble understanding the plugin documentation and figuring out where the place for me to wire this in would be.
The ideal scenario would be to be able to pass a file name, variable name, and variable value to the plugin (for brevity I've left out the constructor to take in these arguments), and then override/re-assign them in the given file.
I.e. Index.ts would have let myVariable = false;
, and I'd like to flip this to true based on passed in parameters to webpack.
With the below code, I can use the parser to find the variable, but I can't seem to change it. I've tried statement.declarations[0].init.raw = "true"
and statement.declarations[0].init.value = true
, but the output index.js file still has the original false value.
Am I trying to do this in the wrong part of the webpack process, or do I need to be using a different hook? Any guidance on how or where I could do this would be really helpful. Thanks.
class MyPlugin {
apply(compiler) {
compiler.hooks.beforeCompile.
tap('MyPlugin', ({ normalModuleFactory }) => {
normalModuleFactory.hooks.parser.
for("javascript/auto").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/dynamic").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/esm").
tap("MyPlugin", handler);
});
function handler(parser, options) {
parser.hooks.statement.tap('MyPlugin', (statement) => {
const module = parser.state.module;
if (module.resource
&& module.resource.endsWith('index.ts')
&& statement.type === 'VariableDeclaration'
&& statement.declarations[0].id.name === 'myVariable') {
// Do something here??
}
});
}
}
}
module.exports = MyPlugin;
webpack-4 webpack-plugin
I'm trying to re-assign a variable in a specific file dynamically based on passed in build arguments but I'm having trouble understanding the plugin documentation and figuring out where the place for me to wire this in would be.
The ideal scenario would be to be able to pass a file name, variable name, and variable value to the plugin (for brevity I've left out the constructor to take in these arguments), and then override/re-assign them in the given file.
I.e. Index.ts would have let myVariable = false;
, and I'd like to flip this to true based on passed in parameters to webpack.
With the below code, I can use the parser to find the variable, but I can't seem to change it. I've tried statement.declarations[0].init.raw = "true"
and statement.declarations[0].init.value = true
, but the output index.js file still has the original false value.
Am I trying to do this in the wrong part of the webpack process, or do I need to be using a different hook? Any guidance on how or where I could do this would be really helpful. Thanks.
class MyPlugin {
apply(compiler) {
compiler.hooks.beforeCompile.
tap('MyPlugin', ({ normalModuleFactory }) => {
normalModuleFactory.hooks.parser.
for("javascript/auto").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/dynamic").
tap("MyPlugin", handler);
normalModuleFactory.hooks.parser.
for("javascript/esm").
tap("MyPlugin", handler);
});
function handler(parser, options) {
parser.hooks.statement.tap('MyPlugin', (statement) => {
const module = parser.state.module;
if (module.resource
&& module.resource.endsWith('index.ts')
&& statement.type === 'VariableDeclaration'
&& statement.declarations[0].id.name === 'myVariable') {
// Do something here??
}
});
}
}
}
module.exports = MyPlugin;
webpack-4 webpack-plugin
webpack-4 webpack-plugin
asked Nov 13 at 0:19
TekGiant
4092622
4092622
add a comment |
add a comment |
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53272016%2funable-to-re-assign-variable-in-webpack-plugin-using-parser-hook%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown